色彩理论是设计的基础语言。理解色轮与配色关系，才能做出和谐、有层次的设计。本笔记梳理色轮、颜色分类、互补色与常见配色方案。

什么是色轮（Color Wheel）

色轮是可视化颜色之间关系的工具：相近的色相彼此相邻，差异较大的色相距离更远。当两个颜色在色轮上正好相对，它们互为互补色。

色轮分为三个颜色层级：

层级	说明	示例
原色（Primary）	无法由其他颜色混合而成	红、黄、蓝（RYB 体系）
二次色（Secondary）	两种原色混合	橙（红+黄）、绿（黄+蓝）、紫（红+蓝）
三次色（Tertiary）	原色+相邻二次色	黄橙、红橙、红紫、蓝紫、蓝绿、黄绿

互补色（Complementary Colors）

定义：在色轮上处于相对位置的两个颜色（相隔 180°）。

两个关键特性：

1. 混合时会产生中性色（灰/褐），视觉趋于平静
2. 并排时对比最强、最醒目，吸引注意力

经典互补：红↔绿、蓝↔橙、黄↔紫。设计上用互补色做强调时，用色要克制——互补色大面积同时使用会造成视觉疲劳。

常见配色方案（Color Harmony）

方案	色轮关系	特点	适用
Analogous（邻近色）	30-60° 内相邻	自然、低张力、和谐	渐变、自然主题、背景层
Triadic（三角色）	120° 均匀分布	平衡又活泼	数据可视化、创意界面
Complementary（互补）	相对 180°	强对比、醒目	强调、CTA、品牌
Split-complementary（分裂互补）	一色 + 互补色两侧	对比但柔和	编辑排版、复杂界面
Monochromatic（单色）	同色相不同明度/饱和度	极简、统一	简约品牌、层级设计

色相命名标准区间（量化依据）

给颜色命名或约束 AI 生成色相时，使用以下标准区间（基于 mrmrs/random-display-p3-color 的 hue 区间约定，2026-09 由 color-expert 技能共识补充）：

色相名	角度区间（°）
red（红）	345–360, 0–15
orange（橙）	15–45
yellow（黄）	45–70
green（绿）	70–165
cyan（青）	165–195
blue（蓝）	195–260
purple（紫）	260–310
pink（粉）	310–345
warm（暖）	0–70
cool（冷）	165–310

用途：① 写提示词/给 AI 下"偏蓝绿"这类指令时，能精确到区间；② 判断两个"绿"是否真的同类；③ 注意 warm/cool 是色相+彩度的系统偏移，不是单个色相值（详见 色彩理论-AI用色指南 原则④）。

配色实用要点

• 先定角色：主色（Primary）、强调色（Accent）、背景/表面色（Background/Surface）、语义色（Error/Success/Warning）。
• 单色方案：从 1-3 个种子色扩展成全套 8 角色色彩系统，比硬凑多色更专业。
• 区分彩度与饱和度：彩度（Chroma） = 颜色相对于同明度灰色的鲜艳程度；饱和度（Saturation） = 颜色相对于自身亮度的鲜艳程度。两者是不同的维度——"高饱和度深蓝"可以看起来灰扑扑（彩度低），"低饱和度浅黄"却可以很鲜艳（彩度高）。生成色阶时按彩度调，不要混用。
• 性格先于色相：选配色方案时，先定"性格"（pale/muted/vivid/deep/dark 等明度-纯度档位），再定色相——性格比具体色相更能预测和谐（详见 色彩理论-AI用色指南 原则③）。
• 避免过度使用：颜色不当会抢走对内容本身的注意力。

一句话总结

色轮的价值是把"配色方案"变成可查的关系表；落地时先定颜色角色与性格再选色相，并牢记彩度（Chroma）与饱和度是两个不同维度。

关联概念

• 进阶：色彩理论-色彩空间与工具资源（色彩空间、OKLCH、可访问性、工具）
• 实战：色彩理论-AI用色指南（给 AI 的 7 条可执行用色原则）
• 应用：[AI-Agent-主流框架对比](/学习笔记/AI技术/AI Agent/AI-Agent-主流框架对比) 中的 Dify 等 UI 设计同理