用途：该技能用于所有面向用户的前端 UI 任务，默认技术栈为 React、TypeScript、Tailwind CSS、shadcn/ui，目标是产出生产级产品界面，而非仅能运行的 AI 演示页。应用时机是在编写前端代码之前。
主要能力：先检查仓库的框架、路由、Tailwind 配置、已有 shadcn/ui 组件、主题变量、页面模式、数据获取约定与 lint/typecheck/build 脚本，优先遵循现有约定。按固定工作流推进：产品目标、信息架构、视觉方向、布局计划、组件树、状态覆盖、响应式策略、关键自检、代码实现、质量检查。要求实现默认、悬停、焦点可见、加载、空、错误、禁用、移动端、长内容溢出以及权限/只读等状态，并覆盖移动、平板、桌面三档响应式行为。
使用方式：用 React + TypeScript 编写具名组件与类型化 props，使用语义化 HTML、可访问标签、清晰的条件渲染、shadcn/ui 原语和基于主题令牌的 Tailwind 类。间距、圆角、阴影、排版与颜色均有明确规则，如优先 rounded-md/rounded-lg，默认不加阴影，使用 bg-background、text-muted-foreground、border-border 等令牌。表单需含标签、校验、提交中与错误状态；表格需含悬停、选中、行操作与空/加载/错误变体。
适用场景：仪表盘、设置页、管理后台、产品页等数据密集的产品界面，以及重构低质量 UI。
限制：避免渐变、装饰性图标、假指标与假图表、过大字号与圆角、任意颜色；不使用动画库除非明确要求。仓库已有架构时不引入新 UI 架构。若涉及修改仓库，需给出变更文件、运行命令、类型检查/构建结果与已知限制。资料未提供额外安装命令或收费信息。