用途
Tailwind Design System (v4) 用于构建生产级设计系统，基于 Tailwind CSS v4，覆盖 CSS 优先配置、设计令牌、组件变体、响应式模式与无障碍。
适用时机
- 使用 Tailwind v4 创建组件库
- 通过 CSS 优先配置实现设计令牌与主题
- 构建响应式且无障碍的组件
- 统一代码库中的 UI 模式
- 从 Tailwind v3 迁移到 v4
- 使用原生 CSS 特性设置深色模式
主要能力（v4 关键变化）
该技能列出了 v3 与 v4 的模式对照：
- 配置方式：v3 使用
tailwind.config.ts，v4 使用 CSS 中的@theme - 引入方式：v3 使用
@tailwind base/components/utilities，v4 使用@import "tailwindcss" - 深色模式：v3 使用
darkMode: "class"，v4 使用@custom-variant dark (&:where(.dark, .dark *)) - 颜色主题：v3 使用
theme.extend.colors，v4 使用@theme { --color-*: value } - 动画：v3 使用
require("tailwindcss-animate")，v4 使用@theme中的 CSS@keyframes加@starting-style实现入场动画
使用方式
资料提到 CSS 设置、组件模式与迁移相关内容位于 PATTERNS.md。具体安装命令、代码示例与操作步骤暂未提供。
适用场景
适用于需要以 Tailwind CSS v4 建立可扩展设计系统的前端与组件库开发场景，包括设计令牌、主题、响应式与无障碍组件的标准化。
限制
该技能面向 Tailwind CSS v4（2024 年及以后版本）；v3 项目需参考升级指南。其余关于收费、价格、平台、效果等事实暂未提供。