SuperAPI AI 工具集

shadcn-ui

通用与其它

查看项目

更新于 10-16 08:39

技能介绍

用途:用 shadcn/ui 组件构建界面,涵盖 CLI 命令、组件安装、基于 CSS 变量的主题、OKLCH 颜色与自定义模式。它是建立在 Radix UI 与 Tailwind CSS 之上的复制粘贴式组件库,组件不从包导入,而是复制进项目以实现完全掌控。

主要能力与用法:初始化项目用 npx shadcn@latest init;添加组件用 npx shadcn@latest add button card dialog;添加全部用 npx shadcn@latest add -a;添加前查看源码用 npx shadcn@latest view button。init 支持模板(next、vite、start、next-monorepo)、基础色(neutral、gray、zinc、stone、slate)以及 CSS 变量开关。主题系统使用 CSS 变量与 OKLCH 颜色格式,可定义语义色并在 @theme inline 中映射到 Tailwind,支持浅色与 .dark 深色模式。组件模式包括 CVA 变体、cn 工具函数合并类名、复合组件与 data-slot 数据属性;可通过 className 覆盖样式或直接编辑组件文件扩展变体。配置位于 components.json,含 style、rsc、tsx、tailwind 与 aliases 等字段。

依赖:init 会安装 class-variance-authority、clsx、tailwind-merge、lucide-react、tw-animate-css 以及按组件使用的 @radix-ui/*。

限制:资料未提供收费、价格、平台或效果相关信息。