色彩搭配基础：三要素与配色法
一句话：这张图把「色彩搭配基础：三要素与配色法」整理成 42 个知识点、35 张记忆卡；点开节点翻面就能看答案。
色相、明度、饱和度，RGB 与 CMYK，互补、类似、三角配色，冷暖与可读性：35 张卡带你把颜色选对、搭稳，做 PPT、海报、界面都用得上。
SeekFlaw 求瑕是一款 AI 学习工具：把课件、讲义生成思维导图，每个节点翻面就是一张记忆卡，按遗忘曲线（FSRS 算法）安排复习。
42 个知识点 · 35 张记忆卡 · 2 个视频片段。作者：SeekFlaw 编辑团队；发布于 2026-10-23。
色彩三要素
- 色彩三要素指哪三个？：色相、明度、饱和度（也叫纯度）。色相是颜色的相貌，如红、黄、蓝；明度是明暗程度；饱和度是鲜艳程度。 视频出处：B站《【03色彩三要素】色相、明度、纯度分不清？看这个就够了》，UP 主「九月Joyue」（原创），片段 0:24–0:36。
- 判断：往一种颜色里加白，会提高它的明度？：对。加白会变亮、明度升高，同时通常也会让颜色变淡；加黑则会降低明度。 视频出处：B站《【03色彩三要素】色相、明度、纯度分不清？看这个就够了》，UP 主「九月Joyue」（原创），片段 1:17–1:32。
- 往一种颜色里加灰，主要降低它的什么？：饱和度。颜色会变得更灰、更浑浊；饱和度降到零，就成了灰色。
- 黑、白、灰有色相吗？：没有。它们没有色相和饱和度，只有明度高低，所以叫无彩色，也常被当作中性色使用。
- 色环（色轮）是怎么排的？：把色相按红、橙、黄、绿、青、蓝、紫的顺序排成一圈，首尾相接。色环是找互补色、类似色的工具。
- 在 HSL 表示法里，H、S、L 分别是什么？：H 是色相，用 0 到 360 度表示它在色环上的位置；S 是饱和度，L 是明度（亮度），都用 0% 到 100% 表示。
色彩模式与色环
- 屏幕显示用什么色彩模式？基色是哪三种？：RGB 加色模式，基色是红、绿、蓝。三种光都开到最大叠加成白色，都为 0 就是黑色。
- 印刷常用什么色彩模式？：CMYK 减色模式，用青、品红、黄三种油墨再加黑色（K）。油墨叠得越多，反射的光越少，颜色越暗。
- 判断：同一个颜色，在屏幕上和印在纸上看起来总是一样？：错。屏幕自己发光、纸张反射光，色彩模式和能显示的颜色范围也不同，RGB 里有些很鲜艳的颜色在 CMYK 里印不出来，所以常有色差。
- 传统美术色轮的三原色是什么？：红、黄、蓝。两两混合得到橙、绿、紫三种间色（二次色）。
- 屏幕上红光和绿光等量叠加，得到什么颜色？：黄色。这是加色混合，和颜料里「红加黄得橙」的减色逻辑不同。
- 十六进制色值 #FF0000 表示什么颜色？：红色。格式是 #RRGGBB，前两位是红、中间两位是绿、后两位是蓝；FF 是最大值 255，00 是 0。
配色方案
- 色环上相隔 180° 的两种颜色叫什么？：互补色。数字色环上如红与青、蓝与黄，传统美术色轮上则是红与绿、蓝与橙、黄与紫。并排时对比强烈，常用来突出重点。
- 互补色大面积等量并用时，可能出什么问题？：容易刺眼、显得吵。常见做法是一种作主色大面积使用，另一种只作小面积点缀。
- 类似色（邻近色）配色有什么特点？：取色环上相邻的几种颜色，如蓝、蓝绿、绿。过渡自然、和谐统一，但对比弱，需要靠明度差拉开层次。
- 单色配色是什么意思？：只用一个色相，靠明度和饱和度的变化做出层次，如深蓝、中蓝、浅蓝。比较稳妥，但容易显得单调。
- 三角配色怎么取色？：在色环上取彼此相隔约 120° 的三种颜色，如数字色环上的红、绿、蓝。对比丰富，要控制各自的面积和饱和度，避免杂乱。
- 「60-30-10」配色法则是什么意思？：主色约占 60%，辅助色约占 30%，强调色约占 10%。这是设计里常用的经验比例，不是严格规定，可按实际微调。
- 判断：配色用的颜色越多，画面越丰富越好看？：错。颜色太多容易乱。常见做法是用 3 到 5 种颜色，再靠明度和饱和度的变化做层次。
冷暖与情绪
- 红、橙、黄通常归为暖色，那么蓝、青呢？绿和紫呢？：蓝、青属于冷色；绿和紫介于冷暖之间，会随周围颜色和明度偏冷或偏暖。
- 暖色和冷色放在同一画面里，常见的视觉效果是什么？：暖色显得更靠前、更突出，冷色显得更靠后、更退让。所以常用暖色强调重点，用冷色或中性色做背景。
- 判断：同一种颜色在所有文化里含义都相同？：错。颜色的联想随文化和场景而不同，用色前要考虑目标读者；国际化的界面尤其不宜只靠颜色传递含义。
- 中国内地股市行情里，红色表示涨还是跌？和美国市场的习惯一样吗？：红色表示上涨、绿色表示下跌；美国等市场通常相反，绿涨红跌。可见颜色含义随地区习惯而变。
- 为什么警示信息常用红、橙、黄？：这几种高饱和的暖色醒目、容易引起注意，也常与危险、停止的联想相连。但不能只靠颜色，还要配图标和文字。
可读性与无障碍
- 文字和背景颜色的清晰程度，用什么来衡量？：用对比度比值，如 4.5:1。它由两种颜色的相对亮度算出，数值越大越容易读。
- 按 WCAG 2.x 的 AA 级，正文和背景的对比度至少是多少？：至少 4.5:1；大号文字（约 18pt 以上，或 14pt 加粗以上）至少 3:1。
- 判断：浅灰字配白底看着「高级」，就可以不管对比度？：错。对比度不够时，视力较弱的人、在强光下看屏幕的人都会读不清；好看不能替代可读。
- 红绿色觉异常的人容易分不清红和绿，做图表时该怎么办？：不要只靠红绿区分信息，同时加上形状、纹理、标签或数字；也可以选对色觉异常友好的配色。
- 检查配色明度层次，有什么简单办法？：把画面转成黑白（灰度）看看：重要的文字和图形在灰度下仍能区分，说明明度对比够；糊成一片，就要拉开明度。
- 判断：深色背景配纯白文字，一定比浅灰文字更易读？：错。对比度只是可读性的一部分，纯白配深色在长时间阅读时可能显得刺眼；不少深色界面会用略带灰的白，前提是对比度仍达标。
动手配一套色
- 配一套色，第一步通常做什么？：先确定主色：它来自品牌、主题或想传达的情绪，再围绕主色选辅助色和强调色。
- 选好主色后，怎样找辅助色？：在色环上按规则找：取邻近色得到和谐的辅助色，取互补色或三角位置得到对比色；再调明度和饱和度，让几种颜色看起来协调。
- 为什么要给背景、正文、强调各留一个固定的颜色角色？：角色固定，读者更容易形成习惯：背景保持低饱和，正文留足对比度，强调色只用在重点处。到处用强调色，重点就不突出了。
- 判断：高饱和的颜色放得越多，画面越吸引人？：错。到处是高饱和色会互相抢眼、让人疲劳；常见做法是大面积用低饱和或中性色，少量高饱和色放在重点处。
- 为什么要把配好的颜色整理成色板？：色板列出每个颜色的色值和用途，不同页面、不同人都用同一套，风格才统一；要改色时，也只需改一处。
本图由用户创作并分享，SeekFlaw 求瑕不对内容准确性背书。