配色不是挑颜色，是定规矩
团队里关于颜色的争论，八成不是因为审美不同，是因为没有能被引用的判据。
争论的真实结构
A：这个蓝太亮了，眼累。 B：我觉得刚好，暗了就没精神。 A：那换成 #2B5FD9？ B：跟旁边那块绿撞了。
四句话里没有一句可验证。讨论的其实是偏好。
把颜色变成有职能的角色
我们后来不谈具体色值，谈角色：
| 角色 | 职能 | 判断标准 |
|---|---|---|
| 底 | 最大的面积 | 与正文对比度 ≥ 12:1 |
| 墨 | 正文 | 与底对比度 ≥ 7:1 |
| 主色 | 可点击 | 与底对比度 ≥ 3:1，且与墨可区分 |
| 强调 | 数字、关键值 | 面积不超过页面 5% |
| 警示 | 错误 | 色相与主色相差 ≥ 90° |
讨论变成：「这个蓝是主色还是强调？」「主色。」「那 3:1 够不够？测一下。」
争论从审美变成测量。
一个反直觉的发现
定完规矩之后，配色反而更敢用颜色了。因为知道每块颜色承担什么职责，也就知道什么时候可以破例——比如把强调色扩大到 8%，前提是那一屏只有它一个强调。
规矩不是限制自由，规矩是让你知道自己在哪儿越界。
落地清单
- 颜色命名用角色，不用色相（
--primary而不是--blue-500） - 在暗色模式下角色不变，色值单算一套
- 对比度用工具测，不用眼睛估
- 每加一个颜色，要能说出它代替了哪个角色