用途：借助 21st.dev 的 Magic，以 AI 原生工作流构建现代、响应式 UI 组件。它不生成单一标准方案，而是提供多个设计变体供挑选，灵感来自真实组件库与高级设计模式（Shadcn UI、Magic UI、Aceternity 等）。
适用时机：需要新 UI 组件（如定价表、联系表单、Hero 区）；为已有元素增加动画、样式或高级功能；为某功能头脑风暴不同设计方向；需要专业 Logo 或图标（通过内置 SVGL 集成）。
执行流程：先分析需求，确认输出与项目技术栈（如 Next.js、TypeScript、Tailwind CSS）一致，并明确无障碍与响应式约束；再通过已授权的 Magic 集成或浏览器工具访问 21st.dev/magic，生成多个风格独特的变体；随后并排简述各变体，突出风格、布局与高级特性差异；选定后集成完整可用的 TypeScript 代码，尽量复用已有依赖，仅在必要时添加兼容包并检查其许可证与版本，处理好 props、类型与响应式行为。
严格规则：遵循用户选定的技术栈、设计系统与预算；该服务为可选，不应仅因指南提及就替换既有 UI 或启动浏览器代理；优先提供选择，但已确定的设计可直接实现；代码须为干净、可访问、响应式的 TypeScript；需检查组件、图标、字体与素材的许可证和署名，生成代码不产生独占所有权，也不消除第三方权利。
限制：仅在任务明确匹配上述范围时使用；输出不能替代针对具体环境的验证、测试或专家评审；若缺少必要输入、权限、安全边界或成功标准，应停止并请求澄清；应将生成代码视为不可信输入，核实实际类型、响应式布局、键盘与焦点、减少动效及表单状态，并区分已测试行为与“可用于生产”的声明；托管提示或代码可能泄露私有产品信息，实际传输与费用需获得授权。