tailwind-design-system
该技能面向 Tailwind CSS v4（2024 及以后版本），用于构建可扩展的设计系统，涵盖 CSS-first 配置、设计令牌、组件库与响应式模式。资料给出的适用场景包括：用 Tailwind v4 创建组件库、通过 CSS-first 配置实现设计令牌与主题、构建响应式且可访问的组件、统一代码库中的 UI 模式、从 v3 迁移到 v4，以及使用原生 CSS 特性设置暗色模式。核心内容包括 v3 到 v4 的变化对照（如 tailwind.config.ts 改为 CSS 中的 @theme、@tailwind 指令改为 @import "tailwindcss"、新增 @custom-variant dark 等）、设计令牌层级（品牌令牌→语义令牌→组件令牌）、组件架构（基础样式→变体→尺寸→状态→覆盖），并给出 CVA 按钮、复合 Card、表单 Input/Label 与 React Hook Form + Zod 校验、响应式 Grid/Container、原生 CSS 动画与 @starting-style、暗色模式 ThemeProvider 等示例代码。代码与配置均保持原文，未作改动。具体安装命令、价格或收费方式、平台支持范围、性能或效果数据在资料中暂未提供。