SuperAPI AI 工具集

tailwind

前端与建站

查看项目

更新于 10-16 09:50

技能介绍

用途:在编辑使用 Tailwind CSS v4 的项目前加载,统一 v4 写法与设计约定。

主要能力与用法:v4 不再使用 tailwind.config.js,配置写在 CSS 中;Vite 项目使用 @tailwindcss/vite 插件(vite.config.ts 中引入并加入 plugins),非 Vite 环境才回退 @tailwindcss/postcss。深色模式优先用 @variant dark,必须嵌套在父级规则内,且仅在 Tailwind 处理的 CSS 文件中生效。工具类简写:等宽高用 size-*,截断用 truncate。焦点环只用 focus-visible,不用 focus。居中多行文本加 text-balance,左对齐标题加 text-pretty。间距优先 gap。CSS 变量避免重复值,保持 canonical 来源与派生变量引用。设计令牌采用 shadcn/ui 的 --name / --name-foreground 约定,并通过 @theme inline 桥接为 Tailwind 颜色(如 bg-primary)。shadcn 命令统一用 bunx shadcn@latest,例如 bunx shadcn@latest add button card dialog;使用组件前先查文档。

限制:资料未提供具体版本号、性能数据与收费信息;部分内容为项目约定,未说明强制程度。