skill-gallery

theme-factory

Anthropic 的主题工具包:十套预设配色及字体搭配(或生成一套自定义主题),套用到已完成的作品上,比如落地页。只管颜色和字体,不管版式。包括说明、十个小主题文件和一份展示 PDF。

路径
skills/theme-factory · SKILL.md
固定 commit
dbd4588f9e
许可证
Apache-2.0

每道题目固定按 2×2 展示:Codex 原生、Codex + skill、Claude Code 原生、Claude Code + skill。点击截图可查看整页。安装与使用 ↓

擅长什么

以下是 skill 自己的文档里声称的优势,附有出处。这些只是声称,不是结论,请和下面的实际结果对照着看。

测试范围:SaaS 落地页、数据看板、个人博客与作品集。不在范围内的题目标为“不适用”,而不是待运行。

在第二批运行之前,依据 skill 原文决定。原文只点名了落地页;看板和博客作品集依据的是 “reportings” 和 “any artifact”。

SaaS 落地页

landing-saas

Codex 原生

成功
Codex · 原生 — SaaS 落地页,桌面截图(页面顶部)Codex · 原生 — SaaS 落地页,手机截图(页面顶部)
模型
gpt-6.1-sol · high
耗时
7m 51s
Token
in 424k · out 24.5k
使用 skill
不适用
外部资源
fonts.googleapis.com, fonts.gstatic.com
运行日期
2026-10-25

a11y 较严重 1▶ 录屏

👍 0 · 去投票

Codex + theme-factory

成功
Codex + theme-factory — SaaS 落地页,桌面截图(页面顶部)Codex + theme-factory — SaaS 落地页,手机截图(页面顶部)
模型
gpt-6.1-sol · high
耗时
5m 57s
Token
in 221k · out 20.8k
使用 skill
是
外部资源
fonts.googleapis.com, fonts.gstatic.com
运行日期
2026-10-26

a11y 较严重 1▶ 录屏

👍 0 · 去投票

Claude Code 原生

成功
Claude Code · 原生 — SaaS 落地页,桌面截图(页面顶部)Claude Code · 原生 — SaaS 落地页,手机截图(页面顶部)
模型
claude-opus-5-5 · high
耗时
7m 11s
Token
in 30 · cache 873k · out 37.6k
使用 skill
不适用
外部资源
fonts.googleapis.com, fonts.gstatic.com
运行日期
2026-10-26

a11y 较严重 1▶ 录屏

👍 0 · 去投票

Claude Code + theme-factory

成功
Claude Code + theme-factory — SaaS 落地页,桌面截图(页面顶部)Claude Code + theme-factory — SaaS 落地页,手机截图(页面顶部)
模型
claude-opus-5-5 · high
耗时
6m 13s
Token
in 36 · cache 967k · out 37.4k
使用 skill
是
外部资源
fonts.googleapis.com, fonts.gstatic.com
运行日期
2026-10-26

a11y 较严重 1▶ 录屏

👍 0 · 去投票

数据看板

dashboard

Codex 原生

成功
Codex · 原生 — 数据看板,桌面截图(页面顶部)Codex · 原生 — 数据看板,手机截图(页面顶部)
模型
gpt-6.1-sol · high
耗时
6m 56s
Token
in 326k · out 25.8k
使用 skill
不适用
外部资源
fonts.googleapis.com, fonts.gstatic.com
运行日期
2026-10-25

a11y 严重 1▶ 录屏

👍 0 · 去投票

Codex + theme-factory

成功
Codex + theme-factory — 数据看板,桌面截图(页面顶部)Codex + theme-factory — 数据看板,手机截图(页面顶部)
模型
gpt-6.1-sol · high
耗时
11m 14s
Token
in 523k · out 28.6k
使用 skill
是
外部资源
无
运行日期
2026-10-26

a11y 严重 1▶ 录屏

👍 0 · 去投票

Claude Code 原生

成功
Claude Code · 原生 — 数据看板,桌面截图(页面顶部)Claude Code · 原生 — 数据看板,手机截图(页面顶部)
模型
claude-opus-5-5 · high
耗时
8m 03s
Token
in 34 · cache 1.08M · out 46.4k
使用 skill
不适用
外部资源
无
运行日期
2026-10-26

a11y 较严重 1▶ 录屏

👍 0 · 去投票

Claude Code + theme-factory

成功
Claude Code + theme-factory — 数据看板,桌面截图(页面顶部)Claude Code + theme-factory — 数据看板,手机截图(页面顶部)
模型
claude-opus-5-5 · high
耗时
6m 05s
Token
in 36 · cache 923k · out 39.1k
使用 skill
是
外部资源
无
运行日期
2026-10-26

a11y 较严重 2▶ 录屏

👍 0 · 去投票

Codex 原生

成功
Codex · 原生 — 个人博客与作品集,桌面截图(页面顶部)Codex · 原生 — 个人博客与作品集,手机截图(页面顶部)
模型
gpt-6.1-sol · high
耗时
4m 59s
Token
in 218k · out 19.8k
使用 skill
不适用
外部资源
fonts.googleapis.com, fonts.gstatic.com
运行日期
2026-10-25

a11y 较严重 1▶ 录屏

👍 0 · 去投票

Codex + theme-factory

成功
Codex + theme-factory — 个人博客与作品集,桌面截图(页面顶部)Codex + theme-factory — 个人博客与作品集,手机截图(页面顶部)
模型
gpt-6.1-sol · high
耗时
8m 49s
Token
in 221k · out 21.5k
使用 skill
是
外部资源
无
运行日期
2026-10-26

a11y:未发现问题▶ 录屏

👍 0 · 去投票

Claude Code 原生

成功
Claude Code · 原生 — 个人博客与作品集,桌面截图(页面顶部)Claude Code · 原生 — 个人博客与作品集,手机截图(页面顶部)
模型
claude-opus-5-5 · high
耗时
10m 28s
Token
in 24 · cache 661k · out 41.1k
使用 skill
不适用
外部资源
fonts.googleapis.com, fonts.gstatic.com
运行日期
2026-10-26

a11y 较严重 1▶ 录屏

👍 0 · 去投票

Claude Code + theme-factory

成功
Claude Code + theme-factory — 个人博客与作品集,桌面截图(页面顶部)Claude Code + theme-factory — 个人博客与作品集,手机截图(页面顶部)
模型
claude-opus-5-5 · high
耗时
6m 32s
Token
in 34 · cache 963k · out 38.3k
使用 skill
是
外部资源
cdn.jsdelivr.net
运行日期
2026-10-26

a11y:未发现问题▶ 录屏

👍 0 · 去投票

安装与使用

项目级安装:把固定 commit 下的 skill 文件夹(包含 SKILL.md 的那个)复制到你的项目中。画廊运行时也是这样安装的。

Claude Code

安装

把文件夹复制到 <project>/.claude/skills/theme-factory/。

git clone https://github.com/anthropics/skills.git /tmp/theme-factory-src
git -C /tmp/theme-factory-src checkout dbd4588f9e1033efb41dad4bef2f7947c8993d44
mkdir -p .claude/skills
cp -R /tmp/theme-factory-src/skills/theme-factory .claude/skills/theme-factory

使用

# 交互模式
/theme-factory <你的任务>

# 或者在任意请求末尾加上
Use the theme-factory skill.

# 非交互模式,和画廊运行时一样
claude -p '<你的任务> Use the theme-factory skill.'

如果想在所有项目中使用,改为把文件夹放到 ~/.claude/skills/theme-factory/。当请求与 skill 的描述相符时,Claude Code 也会自行加载这个 skill。

Codex

安装

把文件夹复制到 <project>/.agents/skills/theme-factory/。

git clone https://github.com/anthropics/skills.git /tmp/theme-factory-src
git -C /tmp/theme-factory-src checkout dbd4588f9e1033efb41dad4bef2f7947c8993d44
mkdir -p .agents/skills
cp -R /tmp/theme-factory-src/skills/theme-factory .agents/skills/theme-factory

使用

# 交互模式:在请求中提到它,或从 /skills 中选择
$theme-factory <你的任务>

# 非交互模式,和画廊运行时一样
codex exec -s workspace-write '<你的任务> Use the $theme-factory skill.'

如果想在所有项目中使用,改为把文件夹放到 ~/.agents/skills/theme-factory/。Codex 也会根据 skill 的描述自行选用它。

说明

元数据:skills/theme-factory/meta.yaml · Copyright 2026 Anthropic, PBC.