设计系统技能：创建、维护或迁移设计系统，涵盖三层令牌架构（基础 primitive → 语义 semantic → 组件 component）、组件状态定义、CSS 变量体系、间距与排版比例、设计到代码交付、Tailwind 主题配置，以及幻灯片/演示稿生成。适用于需要建立统一设计语言的场景。
主要能力：三层令牌架构示例为 --color-blue-600（基础）、--color-primary: var(--color-blue-600)（语义）、--button-bg: var(--color-primary)（组件）；语义层支持明暗主题切换；提供组件规格模式（默认/悬停/激活/禁用状态下的背景、文字、边框、阴影）；配套脚本包括 generate-tokens.cjs（从 JSON 生成 CSS）、validate-tokens.cjs（检查硬编码值）、search-slides.py（BM25 检索与情境化推荐）、slide-token-validator.py（校验幻灯片 HTML 令牌合规）、fetch-background.py（从 Pexels/Unsplash 取图）；模板 design-tokens-starter.json 提供三层结构起点。
必要用法：生成令牌执行 node scripts/generate-tokens.cjs --config tokens.json -o tokens.css；校验使用 node scripts/validate-tokens.cjs --dir src/。幻灯片系统依赖 docs/brand-guidelines.md、assets/design-tokens.json、assets/design-tokens.css，须导入 design-tokens.css 并仅用 var() 引用令牌，图表须用 Chart.js，命令为 /slides:create "10-slide investor pitch for ClaudeKit Marketing"。
限制与依赖：技能依赖 brand 与 ui-styling；禁止在组件中使用原始十六进制值，须引用令牌。其余价格、平台支持等细节资料暂未提供。