用途：该技能用于构建具有辨识度的生产级前端界面，适用于 UI 组件、页面、仪表盘、应用、落地页、表单、交互界面、数据可视化、图表、设计系统或组件库等对视觉质量有要求的前端工作。
主要能力：提供一套设计与工程指导，包括先确定明确的美学方向与差异化概念；推荐技术栈优先级，如 shadcn/ui、Radix UI、Headless UI、自定义 CSS，图表用 Recharts、Tremor、Victory、D3.js，样式用 Tailwind CSS、CSS 变量、CSS Modules，动画用 Framer Motion、CSS 动画、GSAP；给出“反 AI 感”设计规则，列举应避免的字体、配色、布局、组件与动画模式，并建议使用更具特色的字体搭配、有意图的配色、打破网格的布局和有性格的组件；同时覆盖 React 组件架构、组合优先的 props 设计、状态管理、容器/展示者、复合组件、Render Props、文件组织、Next.js App Router 的服务端/客户端组件、Suspense 流式渲染、数据获取、React 性能与记忆化、Context+Reducer、自定义 Hooks 等模式。
使用方式：资料显示该技能会在构建 UI 组件、页面、仪表盘、应用，创建落地页、表单或交互界面，设计数据可视化或图表，实现设计系统或组件库时自动激活。文档包含 shadcn/ui 的命令如 npx shadcn@latest init、npx shadcn@latest add button card dialog、npx shadcn@latest search @shadcn -q "button"，以及大量代码模式示例，但未提供完整安装步骤或运行环境要求。
适用场景：React 与 Next.js 前端开发，尤其是需要避免通用模板审美的项目。
限制：资料未提供收费、价格、平台支持、性能数据或效果保证等信息；部分内容在资料中被截断，具体细节暂未提供。