# UI 配色规范

## 目标

统一全局 UI 配色，优先使用品牌橙 token，减少素材库等高频界面里的重黑、重灰和孤立蓝色状态。

## Token 使用边界

- 全局组件的背景、文字、边框、hover、selected、active、disabled、focus、overlay 必须优先使用共享 token。
- 品牌强调、主操作、选中态、重点描边优先使用品牌橙 token。
- 只有现有 token 无法表达语义时，才允许新增 token；新增前必须说明使用场景、对比度和替代方案。
- 业务局部颜色不得直接硬编码扩散到组件层；先判断是否应抽象为共享 token。

## 默认状态规范

- hover：使用轻量背景、轻量描边或轻微阴影 token，反馈要柔和，不使用大面积黑灰压暗。
- selected：使用品牌橙 token 的描边、角标或指示条，必须比 hover 更明确；不要用整图白色/黑色蒙层压住素材内容。
- focus：使用共享 focus token，键盘可见，和品牌色协调。
- overlay：仅在需要承载文字、操作或遮罩语义时使用，默认保持轻量透明度。
- primary action：同一操作区默认只保留一个品牌主色按钮，其余操作使用 outline/text/danger 等语义层级。

## 禁止项

- 禁止新增重黑遮罩作为默认 hover 或选中反馈。
- 禁止新增整图白色蒙层作为素材选中反馈。
- 禁止新增黑色主按钮；主操作默认使用品牌主色 token。
- 禁止在同一操作区堆叠多个品牌橙主按钮。
- 禁止新增孤立蓝色 focus；focus 必须走共享 token。
- 禁止为了单个组件临时写一套黑灰状态色。

## AI 编程约束

AI 修改 UI 时必须先找现有 token，再考虑新增 token。涉及素材库、主按钮、hover、selected、focus、overlay 的改动，默认按本规范执行。

## 落地经验

- 素材库的颜色改造不是单纯换一组样式，而是把状态语义收拢到共享 token。
- 选中反馈优先用边框、浅底和角标，不再用整图白色/黑色蒙层压住内容。
- 多选操作收敛到右侧详情栏后，同一区域只保留一个品牌主按钮，入口更清晰。
- 详细的架构变更和实现经验见 [素材库配色与多选架构经验](./UI_COLOR_SYSTEM_LESSONS.md)。