数字显示中的颜色使用

英文原文：http://www.uxmatters.com/mt/archives/2006/01/color-theory-for-digital-displays-a-quick-reference-part-i.php
翻译：Cathy
 
加色法合成中的主要颜色
计算机显示器显示信息时采用三原色（红、绿、蓝）色彩模式。三原色显示器通过加色法合成颜色，按不同强度选择性地照亮显示器上各像素的红、绿、蓝三种荧光点。像素的三种荧光点发出的光混合在一起就合成了一个颜色。在加色合成法中，光谱上的所有颜色都是由一种、两种或三种原色按不同比例混合而成的： 

图1告诉我们三原色是如何通过混合而形成次生色的：
图1——加色合成
 
次生色和过渡色
次生色——青色、黄色和洋红——各由两种原色按相同比例混合而成，如下：

次生色的补色就是三原色中对其形成没有帮助的那个原色。
过渡色——浅黄绿、橙色、艳粉、艳紫、天蓝和碧绿——由相邻的原色和次生色混合按相同比例混合而成，如下：

 
注意：文中所举例子中的颜色都是网络安全色。尽管在网页上不应该对颜色使用上有所限制，但是这样做可以简化范围。网络安全色由216种颜色，过渡色的16进制明度值仅能通过三原色按大致相同的比例混合实现。
 
色盘
图2中的色盘显示了所有的原色、次生色和过度色。
图2——色盘
色盘中的实心三角显示了三原色的相对位置；而倒三角显示了次生色的相对位置；小三角色块显示的是各过渡色。

色温
 
色温是指颜色的相对冷暖度。暖色波长较长，包括色盘上从红色（波长700纳米）到浅黄绿色（波长535纳米）之间的颜色。冷色波长短些，包括从绿色（波长500纳米）到紫色之间的颜色（波长400纳米）。在色盘上，洋红以及其左边的各个颜色都属于暖色；而绿色及其右边的各个颜色都是冷色。通常，一个颜色的冷暖度受周围颜色的影响。
 
相邻对比色会因为同时对比作用的影响而改变其冷暖度， 如图3。
图3——同时对比作用
   
色温对比会产生空间错觉。暖色，如红色，看起来突出，而冷色，如蓝色，看起来后退了。暖色区看起来比冷色区要大。
 
第三次色，非彩色及其它合成色
第三次色是经由补色——色盘上直接相对的两个颜色——混合而成的。由于它们中是由三原色按相同比例混合而成，因此冷暖度相对适中。同样，它们与其它颜色搭配在一起也较为和谐。以下是一些第三次色的例子。

非彩色或者中性色包括白色、各种灰色以及黑色。白色是由色度完全饱和的三原色按相同比例混合而成。黑色没有任何颜色。安全灰色——银色、中灰、深灰、炭灰——也是由三种原色按相同比例混合而成的，但是三原色饱和度依次增强。

和橙色通常是由另种或者三种原色按普通比例混合而成的，例如：

 
16进制色值
在这篇文章中，我采用16进制来表示各颜色的RGB值，这种表示方法在网页中很普遍。例如，淡紫色（#CC66FF），其中CC表示红色所占的比例为80%，66表示绿色所占的比例为40%，FF表示蓝色所占的比例为100%。
表1——网络安全颜色的RGB和比例

RGB值表示光的每种原色的强度——从0%（最暗，表示没有颜色）到100%（最亮，表示颜色最强）。各原色强度的变化会产生各种色相、明度和纯度。
色彩属性
彩色——白色、黑色和灰色以外的所有颜色——有三个属性：
色相——与某一特定波长相对应的可见色
明度——色彩的相对亮度
 
纯度或饱和度——色彩的鲜艳程度
色相
某色相对应着光谱上某一特定的波长——如图4
图4——色盘上的额色相
 
光谱上的不同色相是由三原色按不同比例混合而成的.比如，图5显示了紫色的各种色相.
图5——紫色的色相
 
 
明度
明度表示颜色的亮度。这个属性不仅适用于彩色也适用于中性色（中性色既没有色相也没有纯度）。图6是各中性色的刻度
图6——中性色——网络安全的灰色刻度
这个灰色刻度中的明度从最高（白色）经过各种灰色最后到最低（黑色）。

将黑色或者白色与光谱上的各种颜色混合，就可以得到各种明度的颜色。淡色就是将某一色相与白色混合；色调就是将某一色相与灰色混合；阴影就是将某一色相与黑色混合。深色相或者阴影的明度较低，而浅色相或者淡色的明度较高。例如，下图为红色的各种明度：

不同高饱和度的颜色内在的明度也是不一样的，如图7和8所示。在明度刻度的两端，最亮的黄色的比最亮的蓝色要浅很多。
图7——不同的颜色有不同的明度
在这个明度刻度上，色盘上的高纯度色的明度从最高值（黄色）到最低值（蓝色）。垂直置于一起的个颜色明度大致相同。

图8——各颜色的明度
  
人眼不能轻易区分明度在15%以下的颜色，特别是在刻度最浅和最深的地方。明度差别的最小最好应该在15%和25%之间。
纯度
纯度或饱和度表示的是彩色的相对纯度和轻度。纯度的大小分别对应着鲜艳的颜色和中性的灰色。
高饱和度、高纯度色波长范围较小，因此包含很少的灰色或白色。中等纯度色包含不同波长的颜色，因此包含更多的灰色。低饱和度色有更多不同波长的颜色，因此包含很多白色、黑色和灰色。非彩色——黑色、白色和灰色——的饱和度低至零。图9显示了各种不同纯度的颜色，而图10显示的是具有相同纯度值的各色相。
图9——表示各纯度，包括青色、加勒比海蓝、地中海蓝、深蓝绿色和炭灰色。

图10——具有中等纯度的个色相，包括黄绿色、钴紫色、紫色、修拉蓝和镉橘黄。
色彩和谐
和谐的色彩方案取决于色彩各属性之间的平衡。你可以使用补色，相邻色和单色来实现色彩的平衡。在一个色彩方案中，平衡色相的明度和饱和度是很重要的。实现色彩和谐有五种方法，包括使用补色、相邻色以及单色、同色调和相同饱和度的颜色。
九种实现色彩平衡的主要方法包括
补色可以实现的五种色彩平衡
补色方案——采用色盘上直接相对的颜色
补色分割方案——使用与补色相邻的颜色
三色方案——使用色盘上等距的三种颜色
四色方案——使用色盘上等距的四种颜色
四色补色分割方案——用与补色直接相邻的两组补色分割色
相邻色方案——使用色盘上与该色相邻的一系列颜色
单色
d35b
方案——使用某色不同明度或饱和度的一系列颜色
色调方案——采用具有相同明度的颜色
纯度方案——采用具有相同饱和度的颜色
 
补色方案
补色是指色盘上直接相对的颜色——例如图11所示的绿色和洋红。每一对补色由一个冷色和一个暖色所组成。补色中所含各原色的比例相对平衡，但是其明度和饱和度有可能不同
图11——补色和谐

将补色按相同比例混合可以得出白色
 
补色分割方案
某色的补色分割色与其补色直接相邻。图12是一个补色分割色的和谐配色方案
图12——补色分割和谐

 
天青蓝的补色分割色为橘黄色和淡芥末色

图13——三色和谐

将三色互补色按相同比例混合可以得出白色。
 
四色方案
四色互补色由色盘上距离相等的四种颜色组成。图14是一个四色方案的例子。
图14——四色和谐

补色分割四色方案
补色分割四色方案由色盘上与补色直接相邻的两组补色分割色组成。如图15所示。
图15——补色分割四色和谐

相邻色方案
相邻色方案是将相近的色相放在一起，这些色相通常较柔和，或进含有两种原色，若含有三种原色，其中两种比例较小。相邻色在色盘上的位置较近——如图16
图16——相邻色和谐

单色方案
单色方案是将某个颜色具有不同明度和饱和度的各种色相放在一起。通常单色方案还包括白色、黑色或者灰色。下图显示单色方案也包括中性色：

色调方案
色调就是将明度相同的颜色放在一起。例如，低对比度色调可能只包括浅色，如下：

高对比色调方案只包括深色，如下：

另一种高对比度色调可能只包括阴影，如下：

纯度方案
纯度方案就是将具有相同饱和度的颜色放在一起。比如，高对比度颜色方案可能只包括中等纯度的色相，如下：

色彩对比
一个和谐的色彩方案同样可以通过各颜色在三个属性——色相、明度和饱和度——上的充分对比来实现。
可以通过以下方式实现颜色对比：
色相不同，明度和饱和度一样——见图17
明度不同，色相和饱和度一样——见图18和19
饱和度不同，色相和明度一样——见图20
色相、明度或饱和度——改变色彩属性中的任意两个或改变所有的色彩属性，见图21
图17——通过改变色相来实现色彩对比——例如， 紫红色、橄榄绿和加勒比海蓝

图18——通过改变明度来实现色彩对比——例如， 鲜艳的紫红色、淡紫色和玫瑰红

图19——通过改变明度来实现色彩对比——青色、青绿色和孔雀蓝

图20——通过改变饱和度来实现色彩对比——例如，亮紫色、茄紫色和炭灰色。

图21——通过改变色相、明度和饱和度来实现色彩对比
在这个例子中，图中康乃馨粉色的方块的色相和大小在不同的背景衬托下看起来不同。