1.4.3 用灰度/明度指导色彩搭配

      试着只通过调整不等于0的通道，让上一排的色彩在灰度上保持一致，把三个颜色分别代入到心理学公式。得

      Gray(red) = r * 0.299
      Gray(green) = g * 0.587
      Gray(blue) = b * 0.114

      让它们灰度相等，则

      r * 0.299 = g * 0.587 = b * 0.114

      可见，b值一定最大，不妨让b取最大值255，求得r=97， g=50。把这两个值分别应用到红和绿两个色块上。

      绿色不再显得刺眼，整体感也因为灰度的一致性而变得比之前柔和了（图 1.32）。

      以上算法的局限性也显而易见，灰度永远无法冲破0.114这个关口，因为此时最暗的蓝色已经达到255这个上限，导致颜色最高只能去到11.4%的亮度，明色系无法搭配出来。想要突破这一瓶颈，给多个颜色赋值已经在所难免。
 

图 1.32 适应蓝通道的色彩搭配

      现假设要将灰度等级调整为跟绿色（#00FF00）一致，用心理学公式算得Gray=0.576 * 255 = 147。即对于R和B，都有

      R * 0.299 + G * 0.587 + B * 0.114 = 147

      由于红色和蓝色都比绿色要暗，所以不妨让红色的R和蓝色的B都等于最大值255。

      于是对红色而言，有255*0.299 + G * 0.587 + B * 0.114 = 147，简化得

      G * 0.587 + B * 0.114 = 71

      一条方程，两个未知数，无法求出唯一解，在HSB模型里，H是我们需要拉开的，而B已经被灰度替代，所以只能试图从S下手多加一条方程了。

      无论是HSV还是HSL，饱和度的公式都有一个共同特征，max和min的差别越大，饱和度越高。由于#00FF00的饱和度达到了满值，而max已经让R通道据为已有，所以G和B就只能去占min的位置了。

      令min=0，色彩的饱和度即达到最大值。

      先试着让G=0，则有B * 0.114 = 71，求得B = 623，数值彻底爆了。无奈之下，只能让B=0，此时G * 0.587 = 71，求得G = 121。

      用同样的方法处理蓝色，得到蓝色的RGB数值为（0，201，255）

      把颜色值应用到色块上，哈哈，明色系搭配出来啦，而且也蛮好看（图 1.33）（当然这只是按作者自己的审美标准来评价）。
 

图 1.33 适应绿通道的色彩搭配

      同理我们尝试在不改红色的前提下搭配出一套中等明度的色系，会发现，在要求饱和度达到满值的状况下，总要有一项的数值大于255才能使灰度的计算结果跟红色保持一致，色系搭配失败。这也从一定程度上解释了为什么一个色彩鲜艳而丰富的界面里很少会出现大面积的纯红色（GCD类型的网站除外）。

      另外，根据色相环的构成，如果想使色调更为均匀，选择三色系的时候，最好对美学色环进行等分，比如取0,120,240这样的三个色相，搭配为红黄蓝三色，以达到对比的和谐统一（图 1.34）。

      灰度的另一个任务是给灰度图上色或者是彩图换色（实质上也是取了彩图的灰度之后再重新上色），但考虑到要用比较复杂的代码来实现，就先搁一下吧。
 

图 1.34 等分色相环的配色方案

      有了色彩的基础知识以后，我们就可以从可视化的角度去解读艺术编程，让艺术的探讨不再停留于码上谈兵的层次。