3个实用的配色技巧！( 二 )

2025-12-26 配色

文章插图

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

文章插图

再加上点排版，封面就有了：

文章插图

更多模式大家可以多多尝试，在不同场景下选用最适合自己的那个模式。（当然在用多色的时候一样可以使用颜色叠加）
双色（渐变色）
【3个实用的配色技巧！】关于双色，我主要想分享一下对于双色渐变（线性）的认知与理解。
单从色相来看，双色渐变可以大致分为三种：小、中、大。
1.「小」渐变
「小」渐变就是在色环上，小于 30 度的两个色相之间的渐变，专业术语就是同类色渐变：

文章插图

这种渐变色跨度变化很小，看起来就像是一种颜色的深浅变化（但其实会略微有一点色相的变化），比较保守，容易控制，实用频率很高，比如启动图标、按钮、个人中心背景色等等。

文章插图

2.「中」渐变
「中」渐变在色环上大于 30 度且小于 60 度，专业术语叫邻近色渐变：

文章插图

这种渐变，在色相上有很细腻的变化，看起来更加时尚耐看，比如绿里加点黄：

文章插图

蓝里加点紫：

文章插图

有很多启动页都使用这种渐变方式，因为这里不用太拘谨，可以适当放开一些：

文章插图

3.「大」渐变
「大」渐变在色环上大于 60 度，也可叫撞色渐变（互补色或者对比色）：

文章插图

这种渐变视觉冲击力很强，一般来说产品界面里面很少用到。为什么呢？因为视觉冲击力强是为了吸引眼球，而产品界面主要以内容为主，背景或元素太过抢眼反倒喧宾夺主。
反过来说那些宣传类海报、文章封面、作品包装等内容确实可以做大胆一点：

文章插图

我自己也是在文章封面上用的比较多。
对于渐变，还有很多在同一色相的基础上，利用不同饱和度、明度来实现，但那不在双色范围，就不讨论了。
多色
1. 呼应
对于多色，我并没有太多话语权，因为个人确实使用的比较少，但是有一点很深的感悟就是对于多色，无论你使用邻近色，还是对比色，最重要的是和谐，而和谐最重要的就是呼应。
比如同样是多色，这张图就很怪异：

文章插图

因为蓝色和黄色来的莫名其妙，没有呼应就会显得格外突兀。
而下面这张就会舒服很多：

文章插图

因为背景的绿色、黄色，有眼镜、扩音器颜色的呼应。
2. 取色原理
前期我们选色不能太凭感觉，要有一些简单的理论支撑，比如我想给自己建的蓝胖子模型配个色：

文章插图

蓝胖子身体是蓝色，而且鼻子有一点红色，所以背景色就可以选取蓝色的互补色──红色，再由红色选取个邻近色──黄色：

文章插图

最后由这三个颜色组合成画面：

文章插图

再比如，由一个颜色选个邻近色，再选个同色系的深色：

文章插图

其他那些小胶囊的点缀色只要明度和饱和度在一个调上，用什么色相都不会有太大的问题。

推荐阅读

上一篇：红茶冲泡,四种红茶冲泡方法任你挑选

下一篇：9个logo设计小技巧