主题工厂Skill theme-factory

主题工厂是一个用于为幻灯片、文档、报告、网页等各类产出物快速应用或生成统一视觉主题的工具包。它提供预设主题和自定义主题生成功能,帮助企业实现品牌一致性、提升文档专业度、优化用户体验,并确保配色方案的无障碍性。关键词:主题设计,品牌一致性,视觉样式,配色方案,排版设计,文档美化,网页主题,无障碍设计,深色模式,多格式支持。

前端开发 0 次安装 2 次浏览 更新于 2/23/2026

名称: 主题工厂 描述: 用于为各类产出物应用主题样式的工具包。这些产出物可以是幻灯片、文档、报告、HTML落地页等。提供10种预设主题(包含配色/字体),可应用于任何已创建的产出物,或即时生成新主题。

主题工厂

目的

提供一套工具包,用于将一致的视觉主题应用于各种产出物,包括演示文稿、文档、报告和网页。提供预设主题,并能生成具有协调配色、排版和样式的自定义主题。

使用时机

  • 为演示文稿或文档应用一致的品牌形象
  • 使用专业的配色方案为HTML页面添加样式
  • 根据品牌指南创建自定义主题
  • 将普通产出物转换为带主题的版本
  • 为新项目生成调色板
  • 确保配色选择的无障碍性
  • 创建深色/浅色模式变体
  • 为报告和数据可视化添加样式

快速开始

在以下情况调用此技能:

  • 为演示文稿或文档应用一致的品牌形象
  • 使用专业的配色方案为HTML页面添加样式
  • 根据品牌指南创建自定义主题
  • 将普通产出物转换为带主题的版本
  • 为新项目生成调色板

不要在以下情况调用:

  • 从零开始设计UI组件 → 使用 ui-designer
  • 构建完整的Web应用程序 → 使用 frontend-design
  • 创建视觉艺术或图形 → 使用 canvas-design
  • 专门应用Anthropic品牌 → 使用 brand-guidelines

决策框架

需要主题化?
├── 企业品牌 → 使用品牌色 + 批准字体
├── 快速专业 → 应用预设主题
├── 自定义主题 → 根据主色 + 风格生成
├── 无障碍性 → 确保WCAG对比度比率
├── 深色模式 → 反转并调整颜色
└── 打印友好 → 为纸质输出优化

核心工作流

1. 应用预设主题

  1. 选择目标产出物(幻灯片、文档、HTML)
  2. 从可用预设主题中选择
  3. 提取当前内容结构
  4. 将主题颜色应用于标题、文本、背景
  5. 设置排版(字体、大小、粗细)
  6. 根据主题调整间距和布局
  7. 验证视觉一致性

2. 生成自定义主题

  1. 收集品牌输入(主色、Logo、指南)
  2. 生成互补色板
  3. 选择字体配对(标题 + 正文)
  4. 定义间距比例和组件样式
  5. 创建主题配置文件
  6. 应用于目标产出物
  7. 根据反馈迭代

3. 多格式主题应用

  1. 将主题定义为抽象令牌(颜色、字体、间距)
  2. 创建特定格式的实现(CSS、PPTX样式、docx样式)
  3. 根据产出物类型应用相应的实现
  4. 确保跨格式的视觉一致性
  5. 记录主题使用指南

最佳实践

  • 从无障碍颜色对比度开始(至少满足WCAG AA标准)
  • 将调色板限制在3-5种颜色以保持协调
  • 使用一致的间距比例(4px、8px、16px等)
  • 有意配对字体(对比或互补)
  • 在实际内容上测试主题,而非占位文本
  • 尽可能提供浅色和深色模式变体

反模式

  • 颜色过多 → 限制为主色、辅色、强调色 + 中性色
  • 忽略对比度 → 始终验证无障碍比率
  • 间距不一致 → 使用定义的间距比例
  • 随机字体配对 → 选择具有明确关系的字体
  • 脱离内容设计主题 → 始终使用真实内容测试