用途:该技能面向 Tailwind CSS v4,在涉及 Tailwind CSS、工具类、响应式设计、暗色模式、shadcn/ui、CSS 变量、@theme 指令等工作时自动加载,提供 v4 的用法指导。
主要能力:Tailwind CSS 是工具优先(utility-first)的 CSS 框架,v4 为彻底重写版本,采用 CSS 优先配置(@theme 取代 tailwind.config.js),颜色使用 OKLCH,Vite 插件取代 PostCSS。技能覆盖工具类组合、变体语法(如 hover:、dark:、sm:、group-hover:、peer-invalid:、aria-checked:、data-active:,变体可叠加)、@theme 设计令牌、@layer/@utility/@custom-variant/@apply/@source/@reference 等指令、任意值、移动优先的响应式断点,以及 cn() 辅助函数、暗色模式、group/peer 等常见模式。
使用方式:安装命令为 npm install tailwindcss @tailwindcss/vite;在 CSS 中 @import "tailwindcss";在 vite.config.ts 中引入 @tailwindcss/vite 并加入 plugins。
适用场景:使用 Tailwind CSS v4 构建界面、配置主题令牌、实现响应式与暗色模式、集成 shadcn/ui 等。
限制:资料未提供收费、价格、平台支持范围与效果保证等信息。