用途：设计令牌是设计决策的单一事实来源。该技能介绍如何用 Tailwind CSS 4 的 @theme 指令在 CSS 中定义令牌，而非 JavaScript 配置，从而统一颜色、字体、间距等设计变量。
主要能力与理念：CSS 优先，令牌写在 CSS @theme 中；语义化命名，如 --color-primary 而非 --color-blue-500；中性色带品牌色相（chroma 0.005-0.02），避免纯灰；使用感知均匀的 OKLCH 颜色。选择 @theme 的理由包括 CSS 原生、类型安全自动补全、CSS 变量集成（var(--color-primary)）以及内置暗色模式。
基本用法：在 @import "tailwindcss"; 之后用 @theme 块定义令牌，例如 --brand-hue、--color-primary、--color-background、--font-sans、--spacing-md、--radius-md 等。暗色模式采用相同品牌色相、反转明度，在 @media (prefers-color-scheme: dark) 中覆盖背景等令牌。从 Tailwind 3 迁移时删除 tailwind.config.js，改到 CSS @theme。
最佳实践：使用语义化名称与 OKLCH 颜色，中性色带品牌色相，遵循 8 点间距网格，从一开始支持暗色模式，创建组件级令牌；避免硬编码值、纯灰、通用字体、跳过暗色模式、初期创建过多令牌。
参考文档涵盖颜色系统、排版、间距、暗色模式与组件令牌。该技能提供系统基础，可与前端设计技能配合使用。限制：资料未提供具体安装命令、收费或平台信息。