看过很多配色理论还是学不会？来看我总结的这3个实用技巧！

@菜心设计铺 ：在网上看了很多配色文章，还是没有进步。

因为我看到的都是红色代表热血和活力；蓝色代表技术和未来；绿色代表健康，红蓝对比色、红橙相邻色等。

这些理论有用吗？答案是肯定和有用的。但我认为读一两遍就足够了。如果你每天都看这个，你的配色潜力就会被困在你的身体里，让你感到不舒服。

最近咨询了一些同事朋友关于配色的方法，加上自己的实践，总结了一下，分享了一些脚踏实地、实用的技巧。大纲如下:

单色

1. 选择颜色模式

颜色模式是记录颜色的一种方式，分为多种：RGB 模式、CMYK 模式、HSB 模式、Lab 颜色模式、位图模式、灰度模式、索引颜色模式

而我最常用的就是 HSB 模型，因为它简单直观，易于控制。

HSB 中的 H 代表色相、S 代表饱和度，B 代表明度。

H(色相)一共 360 因为色盘一圈是 360 度，曾经一个色相。

千变万化的颜色都是因为 S(饱和度)和 B(明度)产生的差异。

为什么说 HSB 模式简单直观，易于控制？

比如我们随意选择三个色相，360、23、280：

与其他两种颜色相比，中间的颜色很容易区分饱和度和亮度，值如下：

在这个时候，我们只需要减少中间颜色 S，提高它的 B，三种颜色可以和谐很多：

这就是我说 HSB 原因是模式简单易懂，易于控制。

2. 调色板位置的原理

在选择了常见的模式后，我们需要了解每个单色板的原理，我个人喜欢这样理解这个板（仅供参考）。首先，右上角的红点是每个颜色阶段最纯净的颜色水平。水平向左滑动是在颜色中添加白色，白色越多，颜色越亮越轻；垂直向下滑动是在颜色中添加黑色，黑色越多，颜色越深越重。

当颜色向左下角滑动时，既添加了白色，也添加了黑色，即灰色。

按照这个规律，我举个例子，如果你觉得颜色太浓太重，比如下图的背景红:

相当辣的眼睛，此时可以横向向向左滑动颜色，加入白色，使颜色更轻，与整体图标搭配更和谐：

3. 颜色「禁区」尽量不碰

当然，这里的「禁区」有双引号，没有绝对的禁区，只是说颜色不容易控制，在基本颜色控制不好之前，尽量少碰。

在咨询了很多人后，我发现他们在使用颜色时有一个禁区，不同的人有不同的观点，我可能分为三类：三角形禁区、矩形禁区、扇形禁区（红色禁区），如下图所示：

事实上，不难发现，无论是哪种颜色，右下角的颜色都很少使用，因为它们又厚又脏，很难控制（当然，不排除一些大师可以控制任何颜色）。

这里举个例子，下图是我在这里 C4D 里面渲染的铃铛，暗部看起来太黑，不够透明，其实是因为暗部出现了禁区的颜色:

我们将暗色调整到非禁区颜色：

看看实际效果：

这将使整个铃铛配色更加舒适。

4. 应充分利用叠加模式

很多时候，当我们做一些设计时，我们选择叠加一个底图，因为我们担心背景色太单调。过去，我很少使用颜色叠加模式，最多使用正片叠加底部。当我将图片嵌入浅色背景色时，我通常会直接降低图片的透明度，如下图所示：

这样会让整个画面变得很脏，后来发现很多叠加模式都这么好用，比如「柔光」、「变亮」等等。我把下图模式改成柔光，一对比就干净多了。

加上点排版，封面就有了:

你可以尝试更多的模式，在不同的场景中选择最合适的模式。（当然，颜色叠加也可以用于多色）

双色(渐变色)

关于双色，我主要想分享对双色渐变(线性)的认知和理解。

从色相来看，双色渐变大致可以分为三种:小、中、大。

1.「小」渐变

「小」渐变在色环上，小于 30 两个色相之间的渐变，专业术语是同类色渐变：

这种渐变颜色跨度变化很小，看起来像颜色的深度变化（但实际上会有一点颜色变化），更保守，易于控制，实用频率很高，如启动图标、按钮、个人中心背景颜色等。

2.「中」渐变

「中」色环上的渐变大于色环 30 度且小于 60 度，专业术语称为相邻色渐变：

这种渐变，在色相上有非常细腻的变化，看上去更时尚耐用，比如绿里加点黄：

蓝里加点紫：

许多启动页面都使用这种渐变方法，因为这里不必太拘谨，可以适当地放开一些：

3.「大」渐变

「大」渐变在色环上大于 60 也可称为对比色渐变(互补色或对比色)：

这种渐变视觉冲击力很强，在产品界面中很少使用。为什么？因为视觉冲击力强是为了吸引注意力，而产品界面主要是内容，背景或元素太引人注目，但主导了客人。

另一方面，宣传海报、文章封面、作品包装等内容确实可以大胆一点:

我自己也在文章封面上用的比较多。

对于渐变，在相同色调的基础上，还有很多是通过使用不同的饱和度和亮度来实现的，但这并不在双色范围内，所以就不讨论了。

多色

1. 呼应

对于多色，我没有太多的发言权，因为我真的很少使用它，但有一点深刻的理解是，对于多色，无论你使用相邻的颜色，还是对比的颜色，最重要的是和谐，和谐最重要的是呼应。

比如同样多色，这张图很奇怪:

因为蓝色和黄色莫名其妙，没有呼应就会显得特别突兀。

下面这个会舒服很多:

由于绿色、黄色的背景，有眼镜、扩音器的颜色呼应。

2. 取色原理

在早期阶段，我们不应该凭感觉选择太多的颜色。我们应该有一些简单的理论支持。例如，我想为自己的蓝胖模型搭配颜色：

蓝胖子的身体是蓝色的，鼻子有点红，所以背景色可以选择蓝色的互补色──红色，然后红色选择相邻的颜色──黄色：

最终将这三种颜色组合成图片：

另一个例子，选择相邻的颜色，然后选择相同颜色的深色：

只要其他小胶囊的点缀色调的亮度和饱和度相同，任何颜色都不会有太大的问题。

3. 颜色占比

至于比例，我个人的经验是，你可以先选择一个主色，然后让主色占据很大的位置，这样无论辅色有多错，都有大面积的主色支撑，不会有太大的问题。

将这种简单的匹配，然后扩展复杂的形式。

总结

初学者可以使用相对简单的配色方案，但必须有理论支持，养成良好的思维和习惯，以后才能更方便。

以上是个人对配色的一点感悟和经验。请纠正缺点，共同进步。

欢迎关注作者的微信公众众号：「菜心设计铺」