Tailwind Radix 🔥 最流行

shadcn/ui

组件代码直接复制到你的项目，属于你的UI组件库

🎯 核心理念

shadcn/ui 不是传统意义上的组件库——它将组件代码直接复制到你的项目中。这意味着组件完全属于你，可以无限定制而不受限于库的更新。

🎨 设计基因

代码归属：组件复制到项目，而非npm依赖
Tailwind CSS：完全基于Tailwind样式系统
Radix UI：底层使用Radix无障碍组件
变量驱动：CSS变量控制暗色/亮色主题

🗝️ 核心组件

// 安装
npx shadcn-ui@latest init

// 添加组件
npx shadcn-ui@latest add button
npx shadcn-ui@latest add dialog
npx shadcn-ui@latest add dropdown-menu

// 使用
import { Button } from "@/components/ui/button"
            

🎭 风格还原要点

背景色：#09090b (zinc-950) 深色模式
圆角：radius-md = 0.5rem (8px)
强调色：#10B981 (emerald-500)
边框：zinc-800 (#27272a)
字体：Inter + Geist Mono

💡 为什么流行

shadcn/ui 重新定义了「组件库」。它不是让你适应它的样式，而是让你完全拥有代码。这让它成为2024-2025年最受欢迎的UI库。