如何使用 AI 同步管理 UI 设计令牌（Design Tokens）
解决 UI 体系维护中的“同步失效”问题：通过 AI 统一操作 JSON 令牌源文件与 CSS 变量，确保设计语言在不同格式和主题（如暗黑模式）之间实时一致。
为什么需要这个技能
在构建复杂的设计系统（Design System）时，开发者通常需要维护多套文件：一份作为事实来源（Source of Truth）的 JSON 文件，以及用于实际渲染的 CSS 变量文件。
手动更新这些令牌极其低效且容易出错。例如，在 JSON 中修改了一个品牌色，但忘记更新对应的 CSS 变量，或者在适配暗黑模式时遗漏了某个色值。本技能通过将 AI 接入 StyleSeed 工作流，让 AI 自动处理 list（查询）、add（新增）和 update（更新）操作，确保所有层级的令牌在修改后同步生效。
适用场景
- 需要快速检索当前设计系统中所包含的所有令牌定义。
- 需要新增颜色、阴影、圆角、间距或字体排版令牌，并要求同步更新到实现层。
- 修改现有令牌值，并需要 AI 审计该变更对下游组件产生的影响。
- 项目采用 Toss seed 等架构，同时依赖 JSON 配置文件和
css/theme.css实现。
核心工作流
- 定义操作目标：告知 AI 需要执行的操作（列出、新增或修改）以及具体的令牌名称或值。
- 多文件同步更新：AI 会同时处理以下路径的文件，避免单一修改：
tokens/下的 JSON 源文件。css/theme.css中的 CSS 变量定义。- 相关的字体与基础 CSS 配置文件。
- 语义化校验：AI 会遵循语义化命名原则（Semantic Naming），而非简单的描述性命名（例如使用
color-primary-text而不是color-blue-500）。 - 影响审计：AI 在输出结果时会列出所有被修改的文件，并提示可能受到影响的 UI 组件，提醒开发者进行视觉回归测试。
下载和安装
解压后将目录放入你的 AI 工具 skills 文件夹，重启工具后即可使用。具体路径参考内附的 USAGE.zh.md。
你可能还需要
暂无推荐