用途:google-design 面向 AI 编程智能体,帮助团队用 DESIGN.md 这一 Google 格式规范持久化、结构化地描述视觉识别系统。DESIGN.md 由两部分组成:YAML front matter 存放机器可读的设计令牌,Markdown 正文存放人类可读的设计理由。
主要能力:定义可复用的设计令牌系统;对 DESIGN.md 做结构校验与 WCAG 对比度检查;对比两个设计系统版本以追踪令牌级回归;将令牌导出为 Tailwind 主题配置或 W3C DTCG tokens.json;为 AI 智能体提供权威设计上下文;以单一事实来源引导新项目视觉识别。
安装与用法:可作为 Claude Code 插件安装 claude plugin marketplace add google-labs-code/design.md;npm 安装 npm install @google/design.md;也可直接运行 npx @google/design.md lint DESIGN.md。技能安装命令为 npx skills add https://github.com/akillness/oh-my-skills --skill google-design。CLI 提供 lint(校验结构与 WCAG,出错退出码 1)、diff(比较两版本,检测回归退出码 1)、export(--format tailwind 或 --format dtcg)、spec(输出格式规范,可加 --rules)。还提供编程 API:import { lint } from '@google/design.md/linter'。
令牌结构:包含 name(必填)、version、description、colors、typography、rounded、spacing、components 等字段,组件中可用 {colors.primary} 形式的令牌引用,在 lint/export 时解析。正文分节需按规范顺序:Overview、Colors、Typography、Layout、Elevation & Depth、Shapes、Components、Do's and Don'ts。
适用场景:实现 UI 组件前先定义令牌系统;校验 DESIGN.md 并检查 WCAG 对比度;追踪设计系统版本差异;导出 Tailwind 或 DTCG 令牌;为智能体提供持久设计上下文。
限制:不适用于完整组件 API 设计、响应式布局策略、仅无障碍修复或宽泛 UI 评审,这些应分别路由到其他技能。资料未提供收费、价格与平台支持范围等信息。