配色方法

颜色绝不会单独存在。事实上，一个颜色的效果是由多种因素来决定的：反射的光，周边搭配的色彩，或是观看者的欣赏角度。

有十种基本的配色设计，分别叫做：

无色设计(achromatic)、类比设计(analogous)、冲突设计(clash)、

互补设计(complement)、单色设计(monochromatic)、中性设计(neutral)、

分裂补色设计(splitcomplement)、原色设计(primary)、

二次色设计(secondary)以及三次色三色设计(tertiary)。

无色设计

#363636

#A0A0A0

#D7D7D7

不用彩色，只用黑、白、灰色。

类比设计

#A2007C

#C9B5D4

#211551

在色相环上任选三个连续的色彩或其任一明色和暗色。

冲突设计

#DF0029

#205AA7

把一个颜色和它补色左边或右边的色彩配合起来。

互补设计

#A2007C

#5BBD2B

使用色相环上全然相反的颜色

单色设计

#38044B

#79378B

#C9B5D4

把一个颜色和任一个或它所有的明、暗色配合起来。

中性设计

#945305

#FEEBD0

#C18C00

加入一个颜色的补色或黑色使它色彩消失或中性化。

分裂补色设计

#EC870E

#00676B

#211551

把一个颜色和它补色任一边的颜色组合起来。

原色设计

#DF0029

#F9F400

#205AA7

把纯原色红、黄、蓝色结合起来。

二次色设计

#00AE72

#8C63A4

#EB880E

把二次色绿、紫、橙色结合起来。

三次色三色设计

#00676B

#F1AF00

#D2A6C7

三次色三色设计是下面二个组合中的一个：红橙、黄绿、蓝紫色或是蓝绿，黄橙、红紫色，并且在色相环上每个颜色彼此都有相等的距离。

二、颜色印象空间

色相 & 色调（Hue & Tone）116色体系

色相 & 色调（Hue & Tone）体系的最初来源是根据人的语言对颜色的描述：对偏白的颜色人们通常会使用“浅”、“柔”等形容词来描绘，而对作为三原色的红色（Red）、黄色（Yellow）、蓝色（Blue）等颜色人们自然会联想到“鲜明”、“强烈”等形容词。而色调（Tone——结合明度和纯度的概念）就是人们对可以利用同一形容词描述的颜色进行的汇总。

色相 & 色调（Hue & Tone）体系是结合颜色的三种属性并根据人类心理的角度对颜色进行分类的科学的体系，它在很大程度上方便了用户对颜色的分类和使用。

下面的图像是10色相环与色调（Tone）表，其中色调（Tone）表示以红色（Red）为基准的。

10色相环

在色相 & 色调（Hue & Tone）体系中，10种色相分别是指：

红色（Red）、橙色（Yellow Red）、黄色（Yellow）、黄绿色（Green Yellow）、绿色（Green）、青绿色（Blue Green）、蓝色（Blue）、蓝紫色（Purple Blue）、紫色（Purple）、紫红色（Red Purple）。

色调表

在色相 & 色调（Hue & Tone）体系中，11种色调分别是指：

鲜明（Vivid）、高亮（Strong）、明亮（Bright）、清澈（Pale）、苍白（Very Pale）、灰亮（Light Grayish）、隐约（Light）、浅灰（Grayish）、阴暗（Dull）、深暗（Deep）、黑暗（Dark）。

其中“鲜明”和“高亮”色调的彩度很高，所以会给人一种华丽而又强烈的感觉；“清澈”和“隐约”的亮度和彩度都比较高，所以会给人一种柔和的感觉；“灰亮”和“浅灰”以及“阴暗”会给人一种朴素而又冷静的感觉；“深暗”和“黑暗”的亮度很低，所以会给人一种深沉而又凝重的感觉。

在色调表中，从下到上亮度依次增加，而从左到右彩度依次增加，所以在色调表中越靠上的颜色越亮，越靠右的颜色就越鲜明。

色相 & 色调（Hue & Tone）116色体系就是将前面所介绍的色相环与色调表结合在一起的产物，它是由110种彩色颜色（色相10各等级 X 色调11个等级 = 110种颜色）和6种非彩色颜色所构成的。

色调\色相

红色

橙色

黄色

黄绿

绿色

青绿

蓝色

蓝紫

紫色

紫红

鲜明

#ff0033

#ff9900

#ffff00

#99ff33

#00ffcc

#00ffff

#0099ff

#3366ff

#cc33ff

#ff33cc

高亮

#cc3333

#ff6600

#cccc00

#99cc00

#33cc99

#33cccc

#0099cc

#3333ff

#9900cc

#cc3399

明亮

#ff6666

#ff9933

#ffff66

#ccff00

#33ffcc

#66ffff

#3399ff

#0066ff

#cc66ff

#ff66cc

清澈

#ff9999

#ff9966

#ffff99

#ccff66

#66ffcc

#99ffff

#33ccff

#6666ff

#cc99ff

#ff99cc

苍白

#ffcccc

#ffcc99

#ffcccc

#ccff99

#ccffcc

#ccffff

#99ccff

#9999ff

#ccccff

#ffccff

灰亮

#cc9999

#cc9966

#cccc99

#99cc99

#99ffcc

#99cccc

#66ccff

#6699ff

#9999cc

#cc99cc

隐约

#cc6666

#cc9933

#cccc66

#99cc66

#66cc99

#66cccc

#3399cc

#0066cc

#9966cc

#cc6699

浅灰

#996666

#996600

#999966

#669966

#339966

#669999

#6699cc

#6666cc

#666699

#996699

阴暗

#990033

#cc6600

#999933

#669933

#009966

#339999

#336699

#3366cc

#9933cc

#993399

深暗

#993333

#996633

#666600

#669900

#006633

#009999

#006699

#0033cc

#660099

#990066

黑暗

#660033

#663300

#333300

#336600

#003300

#336666

#003366

#003399

#330066

#663366

N9.5

Neutral

#ffffff

#cccccc

#999999

#666666

#333333

#000000

三、基于相反色相

基于色相-相反色相-类似色调

色相环

色调表

这种配色方案是采用相反色相类似色调的配色方案。

虽然使用了相反的色相，但通过使用类似的色调可以得到特殊配色效果。而影响这种配色方案效果的最重要的因素在于使用的色调。

当使用了彩度比较高的鲜明色调时，所使用色相效果将被突出从而得到较强的动态效果；
当使用了彩度较低的黑暗色调时，即使使用了多种不同的色相也能够得到较安静沉重的效果，这是因为使用暗色调时色相的差异也会变得不太明显。

相反色相、类似色调配色方案的特点：静态的变化效果。

补色与相反色相配色：强调效果，轻快的气氛；

类似色相配色：整齐、安静的感觉。

配色实例

背景色中的黄色与人物中的蓝色构成了相反色相配色，但通过使用类似色调宁造出了安静平和的氛围。

#e49539

#319ad6

#f6cc57

配色辞典

#66cccc

#ffff66

#ff66cc

#ccccff

#ccff99

#ff9999

#009933

#ffcc00

#ff9999

#009999

#ff9933

#660066

#99cc00

#ff9933

#9900cc

#99cc00

#330066

#ff9900

#cccc66

#cc6666

#99cc66

#666633

#cc6633

#999933

基于色相-相反色相-相反色调

色相环

色调表

利用相反色相和相反色调的配色方案，因为采用了相反的色相和色调，所以得到的效果具有强烈的变化感和逆向性。

如果说类似色调配色方案能够凝造整齐的氛围，那么相反色调配色方案凝造出的，就是一种强弱分明的氛围。

影响这种配色方案效果的最大的因素在于所选颜色在整体画面中所占的比例。

相反色相、相反色调配色的特点：变化感和逆向性。

需要根据颜色的色相与色调调整所占比例的大小。

配色实例

高彩度的红色与背景中暗绿色形成鲜明的对比。相反色相、相反色调配色方案通常用于突出显示较暗背景中一个较亮对象。

#d53642

#a39259

#003300

配色辞典

#ff6666

#ffffcc

#6699ff

#ff6666

#ffffcc

#660066

#6666cc

#ffffcc

#3399cc

#ccff66

#660033

#99ccff

#99cc33

#ccffff

#663333

#99cc00

#ccffff

#ff9900

#996699

#ffff66

#003399

#003300

#ffcc99

#336699

非彩色和彩色

利用非彩色和彩色进行配色的方法。

非彩色主要由白色、黑色以及过渡阶段中的灰色构成，在与彩色搭配使用时，它们可以起到突出彩色的效果。

通过搭配使用高亮度的彩色和白色以及亮灰色，可以得到明亮轻快的效果。而低两度彩色和黑色以及暗灰色，可以得到黑暗沉重的效果。

非彩色和彩色配色的特点：当非彩色的范围较大时可以凝造宁静的氛围。

高亮度配色：轻快的感觉；

低亮度配色：沉重的感觉。

配色实例

红色的裙子与黑色的斗篷形成了鲜明的对比，高亮度的红色在黑色的衬托下显得更鲜明。而这种较强的对比会自然地吸引住鉴赏者的目光。黑色的斗篷同时也在衬托孩子雪白的皮肤。

#F12D03

#000000

#F8F3DD

配色辞典

#ffff33

#99ccff

#cccccc

#cccc33

#ffffff

#999999

#003366

#ffffff

#006699

#cccccc

#9999cc

#666666

#cccccc

#990033

#ffffff

#99cccc

#666666

#ffff99

#336699

#cc9933

#333333

#ff3333

#000000

#cccc00

四、基于类似色相

基于色调的配色关系

类似色调配色

相反色调配色

上一幅图像的基本色调为“苍白”色调。同一色调配色是指选择同一色调不同色相颜色的配色方案，例如使用“鲜红色（Vivid Red）”与“鲜黄色（Vivid Yellow）”的配色方案。

类似色调配色是指使用如“清澈”、“灰亮”等类似基准色调的配色方案，这些色调在色调表中比较靠近基准色调。相反色调配色是指示使用如“深暗”、“黑暗”等与基准色调相反色调的配色方案，这些色调在色调表中远离基准色调。

这种配色方案的着重点在于色调的变化，它主要通过对同一色相或类似色相设置不同的色调得到不同的颜色效果。

基于色调的配色方案的优点在于，通过使用同一色相或类似色相尽可能地减少色相使用范围。

这种配色方案在欧洲得到较好发挥，而大部分国家的纸币也使用了这种配色方案。

通过使用多种不同的亮色调，可以制造出具有鲜明对比感的效果；
而使用多种不同的暗色调，可以制造出冷静温和的效果。

基于色调-类似色相-类似色调

色相环

色调表

这是使用同一或类似色相的同时使用类似色调的配色方案，在所有配色方案中能够凝造出最强烈的冷静整齐感觉。但当使用了极为华丽鲜明的色相时，也可以得到强烈变化的感觉。

类似色相、类似色调配色方案的特点：冷静整齐的感觉。

使用类似的色相表现出细微不同的感觉。

配色实例

读书少女的背景以及衣着等都是用了类似色相、类似色调的黄色和橙色，给人一种安详宁静的感觉。这种配色方案在诸多印象派画家的作品中得到了淋漓尽致的发挥。

#F9FCAB

#7F4B36

#957E54

配色辞典

#cccc99

#ffffcc

#cccc66

#99cc00

#ccff00

#cccc00

#cccc33

#006633

#669933

#ff9900

#ffff33

#99cc33

#ff99cc

#ff3366

#ffcc00

#cccc33

#cc9933

#cc3333

#99cccc

#66cccc

#339999

#996699

#cc99cc

#9966cc

基于色调-类似色相-相反色调

配色实例

整个画面以紫色为主。在使用了隐约色调的背景中，紫色的鲜花得到了非常明显的突出效果。

可以发现，只凭借色调的变化也能得到很好的强调效果。

#3C356B

#FFCAF2

#637C67

配色辞典

#ffff99

#ff9900

#666600

#ff9966

#663300

#ff6600

#666600

#cccc66

#006633

#ff9900

#003300

#00ffcc

#003399

#ccccff

#336699

#9900cc

#ccccff

#660099

#cccc66

#333300

#ccff00

#ff99cc

#990066

#ccccff

五、渐变配色

配色实例

这是描绘海边夕阳风景的绘画作品，红橙黄绿的颜色过渡显得非常地美丽。阳光下的大自然向我们展示了很多渐变配色的美妙之处。

#CE5135

#FCB042

#A4E1B8

#1F90DC

配色辞典

#669900

#99cc00

#ccff00

#996699

#cc99cc

#ffccff

#336699

#6699cc

#66ccff

#993333

#ff9900

#ffff00

#ffcccc

#cc9999

#cc6666

#cc6633

#cc3333

#660033

#cccc99

#999966

#666600

#666666

#999999

#cccccc

六、Separation配色

Separation配色——强弱对比效果

Separation是“分离”的意思，通过向颜色与颜色之间插入一个分离色，可以得到强弱分明的配色效果。通常分离色使用白色或者黑色等非彩色，主要用于需要分辨开但颜色差异本身不太明显的配色环境中，还可通过插入到两个对比过于强烈的颜色之间来达到缓冲效果。

分离配色与渐变配色相同，也是基于颜色排列方式的配色方案。

配色实例

背景色中的黄色与人物中的蓝色构成了相反色相配色，但通过使用类似色调宁造出了安静平和的氛围。

#CC0000

#000000

#ffffff

#003366

配色辞典

#99cccc

#ffffff

#ff99cc

#669933

#ffffff

#660066

#ff6600

#ffffff

#99cc00

#cccc99

#ff0033

#99cccc

#ffcccc

#cc3399

#ccffcc

#336699

#ffff00

#996699

#cccc66

#333300

#ffff66

#66cc99

#003300

#ffff66

七、重点突出配色

配色实例

背景色中的黄色与人物中的蓝色构成了相反色相配色，但通过使用类似色调宁造出了安静平和的氛围。

#F51B24

#000000

#ffffff

配色辞典

#ffffff

#cc0033

#cccccc

#cccc99

#cc0000

#ffffcc

#ffffff

#cc0033

#cccc33

#ff9900

#000000

#cccccc

#336699

#ffffff

#cccccc

#003300

#cccc00

#cccccc

#ffffff

#000000

#ffff33

#cccccc

目录

一、基本配色

二、颜色印象空间

色相 & 色调（Hue & Tone）116色体系

三、基于相反色相

基于色相-相反色相-类似色调

配色实例

配色辞典

基于色相-相反色相-相反色调

配色实例

配色辞典

非彩色和彩色

配色实例

配色辞典

四、基于类似色相

基于色调的配色关系

基于色调-类似色相-类似色调

配色实例

配色辞典

基于色调-类似色相-相反色调

配色实例

配色辞典

五、渐变配色

渐变（Gradation）配色——规则与韵律的结合体

配色实例

配色辞典

六、Separation配色

Separation配色——强弱对比效果

配色实例

配色辞典

七、重点突出配色

重点突出配色——强调突出效果

配色实例

配色辞典