用途：Tailwind CSS 4.x 是实用类优先的 CSS 框架，用于快速构建 Web UI 组件、响应式布局与设计系统。移动端样式另见 nativewind（React Native 用 Tailwind 3.x）。
主要能力与 4.x 变化：CSS 优先配置，在 CSS 中用 @theme 替代 tailwind.config.js；单一导入 @import "tailwindcss" 替代多条指令；自动内容检测，无需 content 数组；新 OKLCH 广色域配色；内置 @tailwindcss/vite 插件提升性能。
安装：pnpm add -D tailwindcss @tailwindcss/vite。在 vite.config.ts 中加入 tailwindcss() 插件，在 src/index.css 中写 @import "tailwindcss"，并用 @theme 定义颜色、字体、间距与动画等设计令牌。可用 @variant dark 定义暗色模式变体，用 @utility 添加自定义工具类。完整工具类参考可经 Context7 MCP 查询（mcp__context7__resolve-library-id → tailwindcss）。
使用方式：采用移动优先，先写基础样式再叠加 sm:、md:、lg:、xl:、2xl: 响应式变体；默认断点为 640/768/1024/1280/1536px，可在 @theme 中加 --breakpoint-*。提供按钮、卡片、表单输入等组件模式，以及 group-hover、peer-checked、data-[state=active] 与 first:/last:/odd:/even: 等变体。任意值用 []，如 top-[117px]、w-[calc(100%-2rem)]。
限制与注意：v4 不再用 tailwind.config.js 做定制，也不再用 @tailwind 指令或手配 content，Vite 下改用 @tailwindcss/vite 而非 PostCSS 插件；桌面优先、硬编码颜色、忽略焦点态属反模式。迁移步骤为安装新包、替换 PostCSS 配置、替换 @tailwind 指令、将主题移入 @theme、删除 content 数组并测试。可用 pnpm build 检查生成 CSS 体积（目标 < 50KB），pnpm dev 监听变更。收费、价格与平台支持范围暂未提供。