演示与视觉04 / 10

60-30-10 配色

主色 60%、辅色 30%、强调色 10%。

学会用时15 分钟
你的收获配色不花、不乱
用到的频率每周 2 次
难度入门

01为什么学

没学之前

页面颜色很多，看着花，却没有重点。

学会之后

大面积用主色，中面积用辅色，小面积用强调色，层次清楚。

给任何页面一个简单可靠的配色比例
强调色只用在最重要的地方

02图解

比例图

主色（背景）辅色（文字、区块）

主色（背景）60%白或浅灰
辅色（文字、区块）30%深灰、品牌色
强调色10%按钮、关键数字

强调色越少，越显眼。

03基本单元4 个

主色多为中性色
辅色
强调色按钮、关键数字
中性色黑白灰

04怎么用

主色占约 60%多半是中性色，如白、浅灰
辅色占约 30%用于标题、区块
强调色只占约 10%用在最想让人点或看的地方
全篇强调色不超过一个

05速查表

角色	比例	例子
主色	60%	白底、浅灰
辅色	30%	深灰文字、品牌色区块
强调色	10%	橙色按钮、关键数字

06套用一次

白底（60%）+ 深灰文字和灰色区块（30%）+ 橙色按钮和关键数字（10%）。

07常见的坑

强调色到处用
强调色只出现在 3–5 个地方。
主色用得太鲜艳
大面积尽量柔和，鲜艳留给强调。

08自测与练习

先做 10 秒自测，再动手练一下。

强调色大约占多少？

10 分钟小练习

给一页 PPT 套用 60-30-10，并数一数强调色出现几次。

看参考答案

如果强调色出现超过 5 处，减少。

+配合着学

演示与视觉HSL 色彩模型色相、饱和度、亮度：三个数字描述任何颜色。演示与视觉灰色加强调色数据图先全部变灰，再给重点上色。

演示与视觉的全部 10 条

01一页一观点 02CRAP 四原则 03HSL 色彩模型 0460-30-10 配色 05字号层级 06留白与网格 07图表选择 08灰色加强调色 09演讲结构：钩子、三点、收束 10曝光三角：光圈、快门、ISO