用途:编写并校验主题化 UI 所依赖的设计令牌契约,产出符合 W3C DTCG 2025.10 的 JSON 文件,作为单一事实来源,输出到 docs/specs/design/tokens/。不写应用代码,不绘制素材。
输入:先读取来源,可为已有仓库(优先扫描设计系统)、来自 product-design-spec 的设计规格或屏幕清单、品牌简报或一个想法;--with-design-md 会额外生成可选的 alpha 版 DESIGN.md 文本层。
工作流分四阶段:Detect、Draft、Validate、Hand off。Detect 阶段扫描仓库现有设计系统(tailwind.config.*、shadcn components.json、MUI theme、CSS 自定义属性或原生平台系统),决定复用还是全新创建。Draft 阶段用骨架模板创建单一规范文件:cp <skill-dir>/assets/templates/tokens.dtcg.json docs/specs/design/tokens/tokens.dtcg.json。令牌为含 $value 的对象,组带可继承 $type,别名写作 {group.token.path}。颜色分层为原始基础色板与引用它的语义层(UI 消费语义层)。状态色不得仅靠颜色传达(WCAG 1.4.1)。Validate 阶段运行:python <skill-dir>/scripts/dtcg_validate.py --tokens docs/specs/design/tokens/tokens.dtcg.json 与 python <skill-dir>/scripts/contrast.py --tokens docs/specs/design/tokens/tokens.dtcg.json。校验须打印 VALID,对比度须 0 失败对,输出保存到 docs/specs/design/tokens/contrast-report.md。Hand off 阶段给出单一就绪结论:DTCG VALID、对比度 0 失败、复用或全新路径、是否生成 DESIGN.md。
默认精简:优先单一 tokens.dtcg.json,仅在语义层、组件层过大时才拆分;遇到大型多品牌多主题树应先询问范围。
限制:仅编写和校验令牌契约,不生成应用代码;屏幕结构、流程与状态归 product-design-spec,需求归 product-prd,UX 与无障碍审计归 review-design,图形素材归 codex-imagegen,主题化 UI 构建归 implement-feature。DTCG 固定使用 /tr/2025.10/,目标 WCAG 2.2 AA,不引入 WCAG 3.0 或 APCA。@google/design.md CLI 在运行时探测,不假定存在。