用途：该技能面向 React 系框架（Next.js、Vite、Remix、Astro）的界面开发，结合 shadcn/ui 组件、Radix UI 原语与 Tailwind CSS 工具类样式，用于实现对话框、表单、表格、导航等可访问组件，以及响应式、移动优先布局、暗色模式与主题定制、设计系统令牌，并包含基于 Canvas 的视觉设计内容。
主要能力：组件层由 shadcn/ui 提供基于 Radix UI 的可访问组件，采用复制到代码库的分发模式，TypeScript 优先；样式层由 Tailwind CSS 提供工具类优先、构建期处理、零运行时开销、自动清除无用代码；另含主题与定制、可访问性模式、Tailwind 工具类、响应式设计、Tailwind 定制、视觉设计系统等参考文档，以及 Python 自动化脚本。
使用方式：初始化执行 npx shadcn@latest init，按提示选择框架、TypeScript、路径与主题；添加组件执行 npx shadcn@latest add button card dialog form。纯 Tailwind 的 Vite 项目可执行 npm install -D tailwindcss @tailwindcss/vite，并在 vite.config.ts 中引入 @tailwindcss/vite 插件，在 src/index.css 中写入 @import "tailwindcss";。脚本用法：python scripts/shadcn_add.py button card dialog；python scripts/tailwind_config_gen.py --colors brand:blue --fonts display:Inter。
适用场景：需要可访问 UI 组件、工具类样式、响应式与暗色主题、设计系统与快速原型的前端项目。
限制：资料未提供收费、价格、平台支持范围与效果数据；具体组件清单、主题与可访问性细节需查阅其参考文档。