theming-tokens 用于创建主题系统、颜色变量与设计系统令牌,围绕基础(Primitives)、语义(Semantic)、组件(Component)三层令牌层级组织。基础令牌存原始值(如 --blue-500、--radius-lg、--space-4),语义令牌按用途映射(如 --color-primary、--color-surface、--color-text),组件令牌更具体(如 --button-bg、--card-border、--input-focus)。资料建议用 OKLCH 定义颜色以覆盖 P3 色域,并提供暗色模式覆盖示例(.dark 下重设 --color-background、--color-foreground、--glass-bg)。Tailwind v4 可通过 @import "tailwindcss" 与 @theme 配置 --color-primary、--font-display 等。
其工作流程为强制步骤:实现前使用 TeamCreate 派发三个代理(fuse-ai-pilot:explore-codebase 查找已有令牌、fuse-ai-pilot:research-expert 研究 Tailwind v4 @theme 模式),之后运行 fuse-ai-pilot:sniper 进行验证。
最佳实践包括:使用三层层级、将语义映射到基础、定义暗色模式覆盖、颜色用 OKLCH;不要硬编码十六进制值、不要跳过语义层、不要忘记暗色模式、不要混用色彩空间。验证清单要求基础令牌已定义、语义已映射、存在暗色模式覆盖、Tailwind v4 的 @theme 已配置、组件中无硬编码十六进制。
适用场景为前端设计系统与主题系统的令牌建设,具体语境为 Tailwind v4 与 CSS 变量。限制方面:上述代理名称、TeamCreate 与 sniper 等为资料描述的工作流要求,其可用性、平台依赖与具体安装方式暂未提供;其余细节以实际项目为准。