用途:在构建 React 界面、实现设计系统或需要预置无障碍组件时使用 shadcn/ui。它基于 Radix UI 与 Tailwind CSS,把组件代码直接复制进项目,由你完全拥有并自定义,不依赖传统组件库。不适用于非 React、无 Tailwind、需要锁定版本化组件库或纯 HTML/CSS 项目。
主要能力:提供表单、浮层、导航、反馈、数据展示、布局等组件,以及 shadcnblocks.com 的 829 个区块,覆盖 Hero(162)、Navbar、Footer、Feature(266)、Gallery、Pricing、Testimonial、CTA、FAQ 等分类。
使用方式:先运行 npx shadcn@latest init,按提示选择样式、颜色和 CSS 变量;再用 npx shadcn@latest add button、dialog、form 等把组件安装到 components/ui/,从 @/components/ui/ 导入使用。区块则到 shadcnblocks.com/blocks 浏览分类、复制代码、补齐依赖后粘贴到组件文件并自定义。常见模式含 react-hook-form + zod 表单、Dialog 弹窗、Toast 提示、Table 表格等。主题颜色在 globals.css 中调整,变体通过 class-variance-authority 扩展。
限制:资料未提供收费、价格、性能指标或版本兼容范围;导入路径、安装命令和依赖需以实际 CLI 提示为准。