色彩丨设计师必看的基本配色法则

明度即色彩的亮度。明度的变化来自于颜色中白色的成分变化。一般情况下在颜色中加入白色，明度提高，加入黑色，明度降低。

最后，我们说一下色相环。所谓“一生二，二生三，三生万物”，我们就可以运用到我们的色相环中来，我们所看到的12色色相环，就是在稀疏的六色中，往这些间隙里再均等加入两两颜色的间色。这样我们就能清楚地了解到三原色（红黄蓝）→间色（橙绿紫）→12色相环的产生过程。

所以，不管我们在这些颜色间隙里再加入多少间色，这些缤纷的颜色仍可构成一条连续的色带。由于是按顺序排列，两两色彩过渡自然，所以单独拎出来，再刺眼的颜色只要被放回到“左邻右舍”身边，也立即柔和平静下来。

了解色彩之间的关系是我们色彩搭配的基础。而色环能够让我们更加方便地观察各色彩之间的关系，并进一步使用它们。

颜色搭配法则

在了解了基本色彩理论后，小夫子来跟大家分享一套所谓的颜色搭配方式和公式。它基本分为以下六种，分别为 单色系搭配、同类色搭配、互补色搭配、分裂互补色搭配、正三角搭配以及四元搭配。

单色系搭配

单色系配色是指单一色相内的色彩搭配，在不改变色相的情况下， 通过改变同类色的明度和纯度增加色彩的层次感和秩序感。

最大程度上保持了 视觉上的协调统一，给人以简洁、有条理的感觉。

同类色搭配

色环上夹角为60度的三个相邻的色相称为同类色，将它们搭配在一起会很和谐。例如，红－红橙－橙，黄－黄绿－绿，蓝－蓝紫－紫等均为类似色。

同类色由于色相对比不强给人以 平静、舒适的感觉，可以在同一个色调中制造丰富的质感和层次。

互补色配色

互补色彼此相对，放在一起会形成对比效果，例如蓝色和橙色或者经典红和绿色等。

它有非常强烈的对比度，在颜色饱和度很高的情况下，可以创建很多十分震撼的视觉效果。

但是，在互补色的搭配要非常注意 主从关系，即主色若纯度高，从色纯度应低；若主色明度高，从色明度一定应低；如果主色面积大，从色面积就要小。

这样搭配的效果容易给人以 富于变化、明快、鲜亮感。但是搭配不当则会给人不舒适、廉价的感觉。

分裂互补配色

分裂互补色方案是互补色方案的变体。除基色外，它还使用与其补色相邻的两种颜色。

该配色方案与补色配色都 具有相同的强烈视觉对比度，但分裂互补色配色张力较小。所以，分裂互补色搭配是初学者很好的选择，因为它不容易搞砸。

正三角配色

正三角配色方案是在色环上等距选择出三种色彩进行搭配的方式，在色轮上形成一个正三角形，色彩对比效果十分强烈。

即使使用浅色或不饱和版本的色调，三重色调也会非常生动。

为了成功地使用三重色调更加和谐，在配色时应该仔细 平衡颜色，选出一种色彩作为主色，另外两种作为辅助色。

四元搭配

四元配色同样是互补色搭配的变体，相比上面的分裂互补色，这个搭配把两种色彩都替换成了类似色。

这种搭配的 色彩非常丰富，能使画面产生节奏感。

在颜色搭配时应注意 颜色之间的平衡，主色与辅色的平衡以及冷暖色调的平衡。

以上就是几种基本的配色方法，大家可以在此基础上尝试更多的配色风格。比如在同色系、对比色系的基础上，有目的地加入色彩元素丰富色调，在保持整体色彩层级的同时，加入更丰富的变化，从而达到配色目标。

配色是一个很不容易掌握的技能，细微的饱和度或者明度的调整变化，都会带给人不同的感受。 配色也不是单独存在的，不同的设计载体、项目要求，都会有不同的目标，这就决定了配色法则并不能生搬硬套。

最后推荐几个常用的配色网站：

Adobe官方在线配色 color.adobe.com

CSS渐变色在线生成器 colorzilla.com

日本传统配色 nipponcolors.com

主体配色工具 paletton.com

潘通的 pantone.com

上传图片提取配色 colorfavs.com

今天，小夫子给大家讲的仅仅是色彩搭配本身的规律，而 不同的使用场景与目标都会影响色彩的选择与搭配，而这些则需要大家在设计工作过程中不断地积累经验。希望大家在读完本篇文章后，能够掌握基本的配色法则，并在以后的项目中灵活运用，并最终形成自己的优秀配色习惯。

《我想和你聊聊天——创新私塾线上调研活动》

《私塾月刊丨创新设计五月谈》

《设计大师丨世界级顶尖工业设计大师——德国篇（一）》

（图文素材部分来源于网络，如有侵权，请联系作者删除）

点“在看”给我一朵小黄花 返回搜狐，查看更多