| Tone\ | 色相Hue | 1 | 2 | 3 | 4 | 5 | -1 | -2 | -3 | -4 | -5 | |||
| 色调 | 对比度→ | 红 | 橙 | 黄 | 黄绿 | 绿 | 青绿 | 蓝 | 蓝紫 | 紫) | 紫红 | 无色彩 | ||
| 亮度↑ | R | YR | Y | GY | G | BG | B | PB | P | RP | Neutral | |||
| 鲜明 | V | 华丽而强烈,对比度高 | ||||||||||||
| ff0033 | ff9900 | ffff00 | 99ff33 | 00ffcc | 00ffff | 0099ff | 3366ff | cc33ff | ff33cc | |||||
| N9.5 | ffffff | |||||||||||||
| ff3333 | ff3300 | ffff33 | 99ff00 | 00ff33 | 33ffff | 0033ff | 3300ff | cc00ff | ff00cc | |||||
| 高亮 | S | N9 | 华丽而强烈,对比度高 | |||||||||||
| cc3333 | ff6600 | cccc00 | 99cc00 | 33cc99 | 33cccc | 3333ff | 9900cc | cc3399 | ||||||
| 0099cc | ||||||||||||||
| cc0000 | ff0000 | 66cc00 | 66ff00 | 33ff66 | 00cc66 | 0000ff | cc00cc | ff00ff | ||||||
| 明亮 | B | N8 | ||||||||||||
| ff6666 | ff9933 | ffff66 | ccff00 | 33ffcc | 66ffff | 0066ff | cc66ff | ff66cc | cccccc | |||||
| 3399ff | ||||||||||||||
| ff3366 | ff6633 | 66ff33 | 66ff33 | 66ff66 | 00ff99 | 0000ff | cc33ff | ff33ff | ||||||
| 清澈 | P | N7 | 柔和的感觉,亮度和对比度都较高 | |||||||||||
| ff9999 | ff9966 | ffff99 | ccff66 | 66ffcc | 99ffff | 33ccff | 6666ff | cc99ff | ff99cc | |||||
| ff0066 | ffcc00 | ccff33 | 66ff66 | 33ff66 | 33ff99 | 00ccff | 6633ff | cc66cc | ff66ff | |||||
| 苍白 | VP | N6 | ||||||||||||
| ffcccc | ffcc99 | ccff99 | ccffcc | ccffff | 9999ff | ffccff | 999999 | |||||||
| ffffcc | 99ccff | ccccff | ||||||||||||
| ff6699 | ffcc33 | 99ff66 | 99ff99 | 66ff99 | 9933ff | ff99ff | ||||||||
| 灰亮 | Lgr | N5 | 朴素而冷静 | |||||||||||
| cc9999 | cc9966 | cccc99 | 99cc99 | 99ffcc | 99cccc | 66ccff | 6699ff | 9999cc | cc99cc | |||||
| cc3366 | ff9966 | 66cc66 | 33cc33 | 33ff33 | 00ff66 | 00cccc | 6600ff | 9966ff | ff3399 | |||||
| 隐约 | L | N4 | 柔和的感觉,亮度和对比度都较高 | |||||||||||
| cc6666 | cc9933 | cccc66 | 99cc66 | 66cc99 | 66cccc | 0066cc | 9966cc | cc6699 | 666666 | |||||
| 3399cc | ||||||||||||||
| cc0066 | cc9900 | cccc33 | 99cc33 | 33cc00 | 00cc99 | 3300cc | 9900ff | cc3366 | ||||||
| 浅灰 | Gr | N3 | 朴素而冷静 | |||||||||||
| 996666 | 669966 | 339966 | 669999 | 6666cc | 666699 | 996699 | ||||||||
| 996600 | 999966 | 6699cc | ||||||||||||
| cc3300 | 33cc00 | 00cc00 | 009900 | 6633cc | 663399 | cc0099 | ||||||||
| 阴暗 | Dl | N2 | 朴素而冷静 | |||||||||||
| 990033 | cc6600 | 999933 | 669933 | 009966 | 339999 | 336699 | 3366cc | 9933cc | 993399 | 333333 | ||||
| cc0033 | cc6633 | 999900 | 33cc33 | 009933 | 009933 | 333399 | 3333cc | 6600cc | 990099 | |||||
| 深暗 | Dp | N1 | 深沉凝重,亮度很低 | |||||||||||
| 993333 | 996633 | 666600 | 006633 | 009999 | 006699 | 0033cc | 660099 | 990066 | 000000 | |||||
| 669900 | ||||||||||||||
| 990000 | 993300 | 666633 | 336633 | 006666 | 333366 | 000099 | 000066 | 993366 | ||||||
| 黑暗 | Dk | 深沉凝重,亮度很低 | ||||||||||||
| 660033 | 663300 | 333300 | 336600 | 003300 | 336666 | 003366 | 003399 | 330066 | 663366 | |||||
| 663333 | 660000 | 330000 | 006600 | 003333 | 006666 | 000033 | 330099 | 330033 | 660066 |
(一)不同颜色之间的印象差异
1.红色:动态的感觉。
2.蓝色:静态的生硬的感觉。
3.黄色:柔和的动态的感觉。
4.绿色:柔和的感觉,既不动态也不静态。
(二)配色印象空间
设计站点时,通常都需要搭配四五种甚至更多种颜色,为了对多种颜色的混合使用进行评价,需引入新的分析方法----配色印象空间。
1.静态柔和感觉:通常都是隐约柔和颜色之间的搭配。
2.动态柔和感觉:通常都是鲜亮颜色间的搭配。
3.动态生硬感觉:通常都是鲜亮颜色和浑浊暗淡色之间的搭配。
4.静态生硬感觉:通常都是灰冷颜色之间的搭配。
在“配色印象空间”中,相距较远的颜色之间的印象会有较大的差异,而距离较近的颜色之间的印象会比较相近,也就是说颜色间的距离与印象的差异程度成正比例关系。
(三)配色基本知识
1.基于色相的配色关系:
采用不同色调的同一色相时,称之为同一色相配色。
采用两侧相邻的色相配色时,称为类似色相配色。
采用互为补色的或使用色相环中距离较远的颜色配色,称为相反色相配色。
同一色相和类似色相配色总体上会给人一种安静整齐的感觉。
相反色相配色则更具变化感。
2.基于色调的配色关系:
选择同一色调不同色相的配色方案,称为同一色调配色。
选择类似基准色调的本色方案,称为类似色调配色。这些色调在色调表中比较靠近基准色调。
选择与基准色调相反的色调的配色方案,称之为相反色调配色。这些色调在色调表中远离基准色调。
(四)典型的五种配色原理
1.基于色相的配色。
基于色相策划了一个配色方案时,获得的效果通常会比较华丽明艳。此方式在拉丁美洲和亚洲使用最为广泛。适当地搭配好补色可以突出显示颜色并给人轻快的感觉,适当地搭配好类似色相可以获得整齐宁静的效果。
特点:可以获得稳定的变化效果。
¤补色与相反色相配色:强烈而鲜明的效果。
¤类似色相配色:冷静而稳重的感觉。
(A)相反色相、类似色调配色。
当使用了对比度较高的鲜明(Vivid)色调时,所使用色相效果将被突出从而得到较强的动态效果;当使用了对比度较低的黑暗(Dark)色调时,即使使用了多种不同的色相也能够得到较安静沉重的效果,这是因为使用暗色调时色相差异也会变得不太明显。
特点:静态的变化效果。
¤补色与相反色相配色:强调效果,轻快的气氛。
¤类似色相配色:整齐、安静的感觉。
TIP:
背景色:用于背景的颜色。
主颜色:主要颜色,起到在整体上显示出站点整体内容和风格的重要作用。
辅助颜色:辅助主要颜色的次要颜色,用于协助主颜色凝造整体气氛。
突出颜色:用于突出、强调显示,主要使用于占用范围较小的按钮、标签等处。
(B)相反色相、相反色调配色。
得到的效果具有强烈的变化感和逆向性。如果说类似色调配色方案能凝造出整齐的氛围,那么相反色调配色凝造出的就是一种强弱分明的氛围。影响这种配色方案效果的最大因素在于所选颜色在整体画面中所占的比例。
此方案通常用于突出显示较暗背景中的某一个较亮对象。
特点:变化感和逆向性。
¤需要根据颜色的色相与色调调整所占比例的大小。
(C)非彩色和彩色
非彩色主要由白色、黑色以及过渡阶段中的灰色构成,在与彩色搭配使用时,可以起到突出彩色的效果。通过搭配使用高亮度的彩色和白色以及亮灰色,可以得到明亮轻快的效果。而低亮度彩色和黑色以及暗灰色,可以得到黑暗沉重的效果。
特点:当非彩色的范围较大时可以凝造宁静的氛围。
¤高亮度配色:轻快的感觉。
¤低亮度配色:沉重的感觉。
2.基于色调的配色。
3.渐变配色。
4.Separation配色----强弱对比效果。
5.重点突出配色----强调突出效果。