用途 21st-ui-build 用于“构建或大幅改动生产级 UI”。它被使用的时机是：在已有项目中新增界面，或对现有界面做实质性变更，并且希望同时兼顾项目自身的设计身份与 21st 提供的素材/组件供给，以加快实现速度。
主要能力与工作流
- 读取项目设计上下文：先读取 .21st/design.json 与 .21st/DESIGN.md。若两者都不存在，则执行 21st init --design-context 生成设计上下文。
- 检查现状：查看目标路由、其最接近的组件、项目指令以及既有 token。文档强调，项目中明确的事实比通用审美更强。
- 先检索再生成：使用 21st search "<specific UI need>" --context auto 进行检索。优先复用项目中已安装的基础组件（primitives），只有当检索/安装 21st 结果能够减少重复或显著改进结果时才使用。
- 处理无合适结果的情况：若没有匹配结果，检查 MCP 的 get_usage.aiGenerationEnabled，或运行 21st usage 并查看 21st AI generation 一行；CLI 1.17.1+ 也支持 21st usage --json。只有在 AI 明确启用时，才使用可用 AI 额度生成项目感知的备选方案：21st generate "<goal and constraints>" --context auto --variants 3。否则，应使用自己的编码代理，基于 21st search 与 21st get（MCP 中为 search 与 get_component）实现备选方案，且不要在无 AI 访问权限时调用或建议托管的 generate 或 iterate_generation。
- 落地实现：在项目真实框架中实现选定方向。当项目期望 React 组件、token 或既有 API 时，不要粘贴草图 HTML。
- 质量要求：保留响应式行为、键盘交互、可见焦点、语义、减少动效（reduced motion）、加载状态、空状态与错误状态。
- 检查与修复：运行项目自身检查，以及 21st review <changed paths>。只自动应用安全且确定性的修复。
设计规则 优先使用项目 token，而非新的任意值；优先使用既有组件，而非平行的相似替身；除非用户明确要求重新设计，否则保留既有密度、圆角、字体排版、图标风格与布局节奏；可用时使用真实产品文案与状态；避免装饰性渐变、过多卡片、玻璃效果、超大标题与动画，除非项目本身支持或用户要求；在未检查之前，绝不声称某个组件、token 或能力存在。
交接说明 报告使用方向、复用的 21st/项目组件、改动的文件以及执行的验证。当用户选定新方向时，在 .21st/design.json 的 decisions 下记录一项持久的视觉选择。
限制 资料未提供该技能的具体收费、价格、支持平台、安装命令细节与效果数据，暂未提供。可用性依赖 21st CLI/MCP 环境，AI 生成能力与额度取决于账号是否启用及 CLI 版本（1.17.1+ 支持 21st usage --json）。