用途：design-code 是一个生成 UI 组件代码的技能，可在任意目标框架中产出组件，输出须遵循 shadcn-ui-design 规范。
主要能力：通过适配器系统渲染组件到目标框架；支持 React+Tailwind、Next.js、SwiftUI（完整参考），以及 Vue、Svelte、Angular、Solid、Web Components(Lit)、React Native、Flutter、Jetpack Compose、vanilla-css、css-in-js（简明适配器）；无对应文件时可按协议“编写新适配器”清单现场生成。
使用方式：确认目标框架与样式方式；读取 .claude/skills/_ux-ui-shared/frameworks/adapter-protocol.md 通用契约；加载具体适配器；从 .claude/skills/_ux-ui-shared/components/* 取组件规格，从 accessibility/aria-patterns.md 取 ARIA 模式；将值解析为 tokens/*.json 令牌；按需应用 aesthetic 方向。
输出规则（强制）：使用令牌，禁止硬编码颜色或原始 Tailwind 调色板；每个交互元素带无障碍；处理 8 种状态；语义层支持暗色模式；移动优先；尊重 reduced motion；交付完整文件无占位符。
验证（完成前强制）：运行 lint_hardcodes.py（零原始 hex/px/ms 及原始调色板类）、validate_theme_refs.py（每个 var(--…) 可解析）；检查状态、无障碍、对比度、暗色模式与响应式；确认单一主题一致性、单一共享基础层、字体加载（禁止 CSS @import 网络字体）、语义令牌按意图使用、禁止 emoji 当图标、破坏性操作确认 UX；运行 taste_audit.mjs 与 verify_states.mjs <file> + --dark、accuracy_report.mjs 并如实报告输出。
限制：仅提供资料所述内容，未提供具体收费、平台兼容清单或效果保证；适配器缺失时需自行编写；耗时与准确性依赖脚本与人工审查。