不是 npm 组件库，而是把组件源码复制进项目——代码归你所有。基于 Radix UI 无障碍原语 + Tailwind CSS，CLI 一键添加，CSS 变量主题，随意改到底。
传统组件库（MUI、Ant Design、Chakra）是你 npm install 的黑盒依赖：想改一个圆角、换一处间距，往往要跟它的主题系统、CSS-in-JS 权重、!important 打架，升级还可能破坏你的覆盖样式。你租用别人的代码，却拥有它带来的所有约束。
shadcn/ui 走了另一条路：它是一个 组件配方集合 + CLI。运行 npx shadcn@latest add button，它把 button.tsx 的源码直接写进你的项目（如 components/ui/）。从此这份代码就是你的——想改就改、没有版本锁定、没有黑盒。底层用 Radix UI 提供无障碍行为原语（焦点管理、键盘导航、ARIA），用 Tailwind CSS + CSS 变量提供样式与主题。
本教程 10 章从零讲到精通：安装配置、components.json、主题与设计令牌、表单组件、react-hook-form + Zod 验证、布局导航、覆盖层组件、数据表格（TanStack Table）、Command / Combobox / Chart 等进阶定制，最后落到搭建一套完整后台面板与工程化 a11y 清单。
六个特性，理解 shadcn/ui 为何成为 2026 年 React 前端的默认选择
CLI 把组件源码写进你的仓库，代码归你所有，可任意修改，无黑盒依赖。
行为与可访问性由 Radix 处理：焦点陷阱、键盘导航、ARIA，全部到位。
所有样式即 Tailwind class，配合 CSS 变量，改主题只需换几行变量。
npx shadcn@latest add 拉取组件、自动装依赖、写入路径别名。
--background / --primary / --radius 等令牌，明暗主题一套变量搞定。
组件都是小块拼装，可自建 Registry 分发你自己的组件库。
10 章从 init 到后台面板，覆盖表单、验证、覆盖层、数据表格、进阶定制
"复制源码你拥有代码"的理念、Radix + Tailwind 基础、与 MUI/Ant/Chakra 对比、CLI init 初始化。
npx shadcn init、components.json、Tailwind 配置、路径别名、CSS 变量注入、暗色模式基础。
CSS 变量（--background/--primary/--radius）、明暗主题切换、自定义调色板、tailwind 映射。
Button/Input/Label/Textarea/Select/Checkbox/Radio/Switch、variant/size 变体、cn() 工具函数。
Form 组件 + react-hook-form + Zod、FormField/FormItem/FormMessage、受控校验与错误展示。
Card/Separator/Tabs/Accordion/Sheet/Sidebar、响应式布局、组合搭建页面骨架。
Dialog/AlertDialog/Popover/Tooltip/DropdownMenu/ContextMenu、Portal 与焦点管理、可访问性。
Table、TanStack Table 集成、DataTable（排序/筛选/分页）、Badge/Avatar/Skeleton、Toast（sonner）。
Command 命令面板、Combobox、DatePicker、Chart、复合组件封装、Registry 自建组件库。
搭建后台面板 Dashboard、主题系统、组件复用策略、a11y 无障碍清单、与 v0/AI 工作流、部署。