shadcn/ui

shadcn/ui 是一套面向现代前端开发者的 React 组件库，但它并不是传统的 npm 包，而是提供可复制粘贴的组件源码。你只需从文档中复制所需的组件代码，直接粘贴到自己的项目中，即可获得样式精美、交互完整、无障碍友好的 UI 组件。这种模式让你完全拥有组件的控制权，可以根据项目需要任意修改样式和逻辑。

组件基于 Radix UI（提供无障碍交互原语）和 Tailwind CSS（提供实用优先的样式系统），使得每个组件都具备开箱即用的美观外观、完善的键盘导航和屏幕阅读器支持。目前收录了按钮、对话框、表单、卡片、图表、侧边栏等几十种常用组件，并且持续更新。

核心特点

• 复制即用：无需通过包管理器安装，直接从文档复制代码到项目。
• 高度可定制：组件基于 Tailwind CSS，你可以通过类名、自定义样式或覆盖主题轻松修改。
• 无障碍友好：依赖 Radix UI，所有组件都遵循 WAI-ARIA 标准。
• TypeScript 优先：组件源码均使用 TypeScript 编写，提供完整的类型定义。

适用人群

适合使用 React 和 Tailwind CSS 的中高级前端开发者，尤其是需要快速搭建原型、构建设计系统或对组件控制权要求高的团队。对于刚接触 React 的开发者，也可以作为学习优质组件设计的参考。

使用方式

访问 shadcn/ui 官方文档网站，浏览组件分类。找到需要的组件后，复制源代码（通常包含组件代码和必要的安装说明），然后粘贴到自己的项目中。部分组件可能需要额外安装 Radix UI 或 Tailwind CSS 插件，文档中会明确列出依赖。

注意事项

由于是代码复制方式，没有版本管理，需要自行跟踪组件更新。建议在项目中使用 Git 管理，或定期对照文档更新组件。此外，部分组件可能在移动端或特定浏览器上有细微样式差异，建议实际测试。