theme-factory 是为 Artifacts 提供主题样式的 Skill——包含 10 套精心设计的配色+字体方案,并支持按需生成自定义主题。
- 🎨 10 套预设主题:涵盖 Ocean Depths、Sunset Boulevard、Forest Canopy 等风格
- 🔤 字体搭配:每套主题包含 Header 和 Body 字体组合
- 🎨 完整色板:每套主题包含 4 种颜色的协调色板(含 HEX 色值)
- ✨ 自定义主题:当预设主题不满足需求时,可按描述生成新主题
- 📋 可视化展示:theme-showcase.pdf 可让用户直观浏览所有主题
- 🔧 一键应用:选择主题后可直接应用到已有 Artifact
当用户说”给这个 artifact 上色”、“换个主题”、“应用一个配色方案”、“给幻灯片加主题”等时触发。
One-Line Summary
Section titled “One-Line Summary”theme-factory is a Skill for theming artifacts — offering 10 preset color palette + font pairing themes, with the ability to generate custom themes on demand.
Core Capabilities
Section titled “Core Capabilities”- 🎨 10 preset themes: Ocean Depths, Sunset Boulevard, Forest Canopy, and more
- 🔤 Font pairing: each theme includes Header and Body font combinations
- 🎨 Complete color palettes: 4 coordinated colors per theme (with HEX values)
- ✨ Custom themes: generate new themes on-the-fly when presets don’t fit
- 📋 Visual showcase: theme-showcase.pdf for intuitive browsing
- 🔧 One-click apply: apply selected theme to any existing artifact
Trigger Scenarios
Section titled “Trigger Scenarios”Triggers when users say “theme this artifact”, “change the theme”, “apply a color scheme”, “theme this slides”, etc.
File Inventory
Section titled “File Inventory”- theme-factory
目录结构分析
Section titled “目录结构分析”theme-factory 是一个**“配置驱动型”(Configuration-driven)** Skill——核心行为由 10 个主题 .md 文件定义,SKILL.md 负责描述应用流程。
- SKILL.md(约 60 行):定义 4 步工作流程:展示 → 询问 → 确认 → 应用
- theme-showcase.pdf:主题预览文件,供用户可视化地浏览所有主题
- themes/:10 个
.md文件,每个定义一套完整的主题方案
SKILL.md 结构解析
Section titled “SKILL.md 结构解析”4 步工作流
Section titled “4 步工作流”- 展示主题(Show the theme showcase):显示
theme-showcase.pdf,让用户直观浏览所有 10 个主题 - 询问选择(Ask for their choice):询问用户想应用哪个主题
- 等待确认(Wait for selection):获得明确的主题确认
- 应用主题(Apply the theme):读取对应主题文件,将配色和字体应用到 artifact
当 10 个预设主题都不满足需求时,SKILL.md 支持”按需生成”自定义主题:
- 根据用户提供的描述生成新主题(命名 + 色板 + 字体配对)
- 预览新主题供用户审核
- 确认后应用到 artifact
SKILL.md → themes/*.md(数据)→ artifact(最终输出)
这是一个典型的”数据驱动”模式——主题是数据而非逻辑,更换主题就是更换数据文件。
Directory Structure Analysis
Section titled “Directory Structure Analysis”theme-factory is a “Configuration-driven” Skill — core behavior is defined by 10 theme .md files, while SKILL.md describes the application workflow.
- SKILL.md (~60 lines): Defines the 4-step workflow: Show → Ask → Confirm → Apply
- theme-showcase.pdf: Theme preview file for visual browsing of all themes
- themes/: 10
.mdfiles, each defining a complete theme specification
SKILL.md Structure Analysis
Section titled “SKILL.md Structure Analysis”4-Step Workflow
Section titled “4-Step Workflow”- Show the theme showcase: Display
theme-showcase.pdffor visual browsing of all 10 themes - Ask for their choice: Ask the user which theme to apply
- Wait for selection: Get explicit theme confirmation
- Apply the theme: Read the corresponding theme file, apply colors and fonts to the artifact
Custom Themes
Section titled “Custom Themes”When none of the 10 presets fit, SKILL.md supports “generate on-the-fly” custom themes:
- Generate a new theme from user description (name + palette + font pairing)
- Preview the new theme for user review
- Apply to artifact after confirmation
Module Relationships
Section titled “Module Relationships”SKILL.md → themes/*.md (data) → artifact (final output)
This is a classic “data-driven” pattern — themes are data not logic, swapping themes means swapping data files.
theme-factory 不包含任何 Python 或 JS 脚本。但它有 10 个主题 .md 文件,扮演了”数据脚本”的角色。
“配置即内容”(Configuration as Content)模式
Section titled ““配置即内容”(Configuration as Content)模式”这是 theme-factory 最独特的设计模式——用结构化 Markdown 文件替代传统配置文件或脚本,作为数据源。
以 ocean-depths.md 为例,展示主题文件的结构:
Script Inventory
Section titled “Script Inventory”theme-factory contains no Python or JS scripts. But its 10 theme .md files play the role of “data scripts”.
”Configuration as Content” Pattern
Section titled “”Configuration as Content” Pattern”This is theme-factory’s most unique design pattern — using structured Markdown files instead of traditional configuration files or scripts as data sources.
Using ocean-depths.md as an example to show the theme file structure:
10 个主题一览
Section titled “10 个主题一览””配置即内容”的关键优势
Section titled “”配置即内容”的关键优势”10 Themes Overview
Section titled “10 Themes Overview””Configuration as Content” Key Advantages
Section titled “”Configuration as Content” Key Advantages”| 主题 | 色板基调 | 最佳场景 |
|---|---|---|
| Ocean Depths | 深海军蓝、青色、海沫、奶油色 | 企业演示、财务报告 |
| Sunset Boulevard | 日落暖橙、深红、金色 | 创意展示、广告提案 |
| Forest Canopy | 森林绿、土褐、苔藓色 | 环保、户外、自然报告 |
| Modern Minimalist | 黑白灰渐变 | 科技、创业 pitch |
| Golden Hour | 琥珀、焦糖、奶油 | 高端品牌、奢侈品 |
| Arctic Frost | 冰蓝、银白、冷灰 | 冬季主题、科技 |
| Desert Rose | 灰粉、沙色、哑光红 | 时尚、美容 |
| Tech Innovation | 深蓝、霓虹绿、电光紫 | 科技产品发布 |
| Botanical Garden | 叶绿、花红、土黄 | 园艺、食品 |
| Midnight Galaxy | 深紫、星银、夜空蓝 | 会议、戏剧活动 |
| Theme | Palette Tone | Best For |
|---|---|---|
| Ocean Depths | Navy, teal, seafoam, cream | Corporate presentations, financial reports |
| Sunset Boulevard | Sunset orange, crimson, gold | Creative pitches, advertising proposals |
| Forest Canopy | Forest green, earth brown, moss | Environmental, outdoor, nature reports |
| Modern Minimalist | Black, white, gray gradient | Tech, startup pitches |
| Golden Hour | Amber, caramel, cream | High-end brands, luxury |
| Arctic Frost | Ice blue, silver, cool gray | Winter themes, technology |
| Desert Rose | Dusty pink, sand, matte red | Fashion, beauty |
| Tech Innovation | Deep blue, neon green, electric purple | Tech product launches |
| Botanical Garden | Leaf green, flower red, earth yellow | Gardening, food |
| Midnight Galaxy | Deep purple, star silver, night blue | Conferences, drama events |
| 特性 | 说明 |
|---|---|
| 人类可读 | Markdown 比 JSON/YAML 更易读、易编辑 |
| Claude 可直接处理 | 无需解析器——Claude 原生理解 Markdown 结构 |
| 版本控制友好 | 每个主题是独立文件,diff 清晰可见 |
| 扩展简单 | 添加新主题只需创建一个新的 .md 文件 |
| 双重用途 | 同一文件既供人类阅读又供 Claude 解析 |
| Feature | Description |
|---|---|
| Human-readable | Markdown is easier to read and edit than JSON/YAML |
| Claude-native | No parser needed — Claude natively understands Markdown structure |
| Version control friendly | Each theme is an independent file, diff is clearly visible |
| Easy to extend | Adding a new theme just means creating a new .md file |
| Dual-purpose | Same file for both human reading and Claude parsing |
- “配置即内容”模式:用 Markdown 文件替代 JSON/YAML 作为配置格式——更易读、更易编辑、Claude 原生支持
- 展示→询问→确认→应用流程:清晰的 4 步用户交互流程,确保用户在每个环节都有知情和控制
- 视觉预览 PDF:theme-showcase.pdf 提供了直观的浏览方式,降低了用户的选择成本
- 自定义主题弹性的:10 个预设 + 按需生成——覆盖 80% 场景的同时保留灵活性
- 10 个主题覆盖完整场景:从企业到创意,从温暖到冷冽,从自然到科技
“如果你想创建其他配置驱动的 Skill(模板库、配色方案、布局预设)…”
- 保留”配置即内容”模式:用 Markdown 文件定义你的配置项
- 替换主题内容:将颜色/字体替换为你需要的配置字段
- 保留展示流程:展示 → 选择 → 确认 → 应用——这是最通用的用户交互模式
- 替换 showcase:将 PDF 替换为你的配置的可视化展示方式
- 添加验证逻辑:在 SKILL.md 中添加约束规则(如”颜色必须有良好对比度”)
⚠️ 主题文件格式需一致: 所有 10 个主题必须遵循相同的 Markdown 结构——如果格式不一致,Claude 解析会出错
⚠️ 展示 PDF 不可修改: SKILL.md 明确要求”不对 theme-showcase.pdf 做任何修改”——但它容易在迭代中被意外修改
⚠️ 自定义主题标准模糊: SKILL.md 说”生成类似上面的主题”,但没有定义严格的 Schema——可能导致生成的主题格式不一致
⚠️ 字体可用性: 主题中指定的字体可能在用户的系统上不存在——需要在应用时做降级处理
⚠️ 确认步骤容易被跳过: Claude 可能在展示后就立即应用,而不是等待用户确认——需要 SKILL.md 明确约束
Design Highlights
Section titled “Design Highlights”- “Configuration as Content” Pattern: Markdown files replace JSON/YAML as config format — more readable, more editable, Claude-native
- Show → Ask → Confirm → Apply Flow: Clear 4-step user interaction, ensuring informed user control at every stage
- Visual Preview PDF: theme-showcase.pdf provides intuitive browsing, reducing user choice cost
- Custom Theme Flexibility: 10 presets + on-demand generation — covers 80% of scenarios while maintaining flexibility
- 10 Themes Cover Full Spectrum: From corporate to creative, warm to cool, nature to tech
Reusable Patterns
Section titled “Reusable Patterns”Porting Guide
Section titled “Porting Guide”“If you want to create other config-driven Skills (template libraries, color schemes, layout presets)…”
- Keep “Configuration as Content”: define your config items with Markdown files
- Replace theme content: swap colors/fonts for your required config fields
- Keep showcase flow: Show → Choose → Confirm → Apply — the most universal user interaction pattern
- Replace showcase: swap PDF for your config’s visual representation
- Add validation logic: constraint rules in SKILL.md (e.g., “colors must have good contrast”)
Common Pitfalls
Section titled “Common Pitfalls”⚠️ Theme file format must be consistent: All 10 themes must follow the same Markdown structure — inconsistent format breaks Claude parsing
⚠️ Showcase PDF must not be modified: SKILL.md explicitly says “do not make any modifications” to theme-showcase.pdf — but it’s easy to accidentally modify during iteration
⚠️ Custom theme standard is vague: SKILL.md says “generate similar to above” but doesn’t define a strict Schema — may lead to inconsistent format custom themes
⚠️ Font availability: Fonts specified in themes may not exist on the user’s system — need fallback handling during application
⚠️ Confirmation step easily skipped: Claude might apply immediately after showing instead of waiting for confirmation — SKILL.md needs explicit constraints
| 模式 | 说明 | 适用于... |
|---|---|---|
| 配置即内容 | 用结构化 Markdown 文件替代 JSON/YAML | 任何以数据配置为主的 skill |
| 展示→询问→确认→应用 | 可视化展示 → 用户选择 → 确认 → 执行 | 任何需要用户选择配置的 skill |
| 预设 + 自定义 | N 个预设选项 + 按需生成 | 需要"常用选项"+ "灵活定制"的场景 |
| 独立主题文件 | 每个主题一个 .md 文件 | 可扩展的配置集合 |
| Pattern | Description | Applies to... |
|---|---|---|
| Configuration as Content | Structured Markdown files replace JSON/YAML | Any data-configuration-driven skill |
| Show → Ask → Confirm → Apply | Visual show → user choice → confirmation → execution | Any skill needing user configuration selection |
| Preset + Custom | N presets + on-demand generation | "Common options" + "flexible customization" scenarios |
| Independent Theme Files | One .md file per theme | Extensible configuration collections |