色彩

Yue 的颜色分三层：原始色板、语义角色、组件 Token。应用和组件优先消费后两层，只有主题定义和可视化工具才直接读取原始色板。

语义角色

用途	Token	规则
页面背景	--page	整个应用的最低层表面
内容表面	--surface	卡片、输入区域和主要内容容器
次级表面	--surface-subtle	工具栏、辅助区域，不用于承载主要操作
组件表面	--surface-component	控件默认背景
主文字	--text-primary	标题、正文和主要操作文字
次要文字	--text-secondary	辅助说明、元数据
占位文字	--text-placeholder	仅用于未填写内容，不替代正文
禁用文字	--text-disabled	禁用内容，不作为信息传达的唯一渠道
默认边界	--border-default	控件和容器的普通边界
强边界	--border-strong	需要明确分组或强调的边界
焦点环	--focus-ring	键盘焦点，不得被视觉重置删除

使用规则

1. 相邻元素通常通过表面、边界或间距区分，不能只依靠颜色差异传达状态。
2. 悬停和按下优先使用 --opacity-hover、--opacity-pressed 与 color-mix()，避免每个组件再发明一套颜色。
3. 状态色必须同时提供前景、背景和边界角色；颜色不是唯一的信息通道，必要时补充文字、图标或结构变化。
4. 组件样式只能消费自己的 Component Token，例如 Button 使用 --button-*，不能跨组件读取 --input-*。
5. 正文和普通控件文字最低 4.5:1；非文本边界、图形和焦点最低 3:1。这里的规范写法是 4.5:1，不是 1:4.5。

验证

corepack pnpm audit:tokens 会对浅色/深色 Azure 配置运行 32 组配对，共 64 项门禁；Neutral Accent 作为诊断配置运行。新增语义角色必须补充配对或明确说明为什么不参与对比度计算。