之所以提笔写这么一篇颜色理论的科普文章,是因为当我想在中文网站里查找时,很难找到全面的内容。有很多都是完全从实用设计的角度来介绍的,这对于像我这样喜欢刨根问底的人来说,并不能感到满足。
颜色理论 (Color Theory) 是一门非常有意思的内容方向,它和乐理一样,是一个横跨艺术和科学的知识体系。学习颜色理论之后,就会知道我们在杂志上、在电脑屏幕、手机屏幕上看到的五彩缤纷是如何产生的,就会知道我们在Photoshop里用到各种颜色混合模式是如何工作的。
那么,让我们先从人对颜色的识别开始说起。
我们之所以有视觉,是因为我们的视网膜上存在两类视觉细胞
而在白天使用的视锥细胞中,又对三种颜色光最为敏感:红、绿、蓝。没错,这就是 RGB 三原色的由来。
视锥细胞主要分布在视网膜中心地区,也就是黄斑,大约700万个细胞会在明光环境下,合成3种「视紫蓝质」,随后产生脉冲告诉大脑,「我看到了某某颜色」。
视杆细胞主要分布在视网膜的非中心区域,大约1亿个细胞会在暗光环境下生成1种「视紫红质」(此物质在明光环境下会被分解),同样产生脉冲告诉大脑,「我看到了有光亮」。
值得注意的是,对人来说的可见光,就是「红橙黄绿青蓝紫」中从红到紫的连续光谱。这里的连续表示,可见光并不是离散的7种颜色的光,而是从紫光的起始段380nm 到红光的终止段750nm中连续的各个波长的光。
好了,问题来了!! 我们发现,在自然可见光的光谱中,并不能找到粉红色,或者是棕色。这时候,我们自然会想要提问,是不是存在某种频率的光,它的颜色是棕色的呢?
答案是否定的,事实上有一件非常重要的事情需要先明确:颜色并不是物理存在的,我们能看到颜色是因为我们的生理构造导致的。
颜色是什么?颜色是生物对于不同频率的光的感知,物种不同,感知能力也不同,比如小狗眼里的世界是黑白的,而在另一个极端,皮皮虾有可以感知16种不同频率段的视觉细胞。
380 - 450nm 的光本身并不是紫色的,至少小狗们不这么认为。但我们人类,恰好能把这个频率段的光和其他光区分光,然后我们姑且给了它一个名字,叫紫色。
所谓颜色,不过是我们的视觉细胞对外界输入的光的一种反应。在复杂的世界中,不仅仅存在单色光,更多存在的是多种频率的光同时投射到我们眼里的情况。
说到这里,终于可回答下棕色到底是怎么回事了,并没有某一个固定频率的光是棕色的,实际上一个物体之所以是棕色,是因为他是由红光 + 黄光 + 蓝光 按照一定比例混合后的到的。
所以,这个世界上,并不存在棕色光。相反,有非常多的光都是合成出来的.而人类在如何合成光的道路上,我们找到了 RGB (Red, Green Blue)。不过在RGB之前,我们更早熟悉的是红黄蓝 (RYB) 三原色。
人类最早合成颜色的经验,是产生自绘画领域。绘画颜料领域的三原色是「红黄蓝」,其发现时间可以追溯到 1600年左右。
之后,1908年在印刷和绘画领域,人们又发现了 CMY 三原色 (Cyan, Maganta, Yellow),再加上 Key Plate 黑色,形成了 CMYK 的颜色模型,并在印刷业中广泛使用。
还剩下一个经典的三原色 RGB,它是在1860年被发现,进而开始被用在摄影行业,一直到1938年,RGB 被用在CRT显示的发明上,这才奠定了 RGB 在我们日常生活中的重要地位。
当我们谈到加色模式和减色模式时,我们指的都是如何使用不同的三原色去合成其他颜色。其中,RGB 对颜色的合成,是加色模式。RYB 和 CMYK 对颜色的合成是减色模式。
什么是发光?能够在外界没有光的情况下,自己辐射出光线被我们看到的就叫发光,比如家里的电灯,街上的霓虹灯、广告牌。
什么是反光?自己不能发光,必须靠反射外界的光才能被我们看到的就叫反光。很明显,在漆黑一片的页面,这些只会反光的物质我们是看不见的。举例来说,身边绝大多数东西都是属于反光系列的,比如一件红色的毛衣,一面黄色的墙,一个绿色的茶杯。
那为什么我们看到的毛衣会是红色的呢?这毛衣本身又不会发射红色的光?要回答这个问题,还得回到「反光」这个词上来,反光的关键在于,有些光被反射了,而另一些并没有。那没被反射的光去了哪?它们是被这件毛衣给吸收了,转化成了其他能量。
反光,就是吸收一部分光,反射一部分光。对于原来的那束射向毛衣的光来说,被吸收的部分做的就是减法,因此反光物体用的颜色合成方法,叫做减色模式。
下面,让我们重新来看一下 RGB 的图,然后来写几个加色模式下的颜色合成公式。
红 (R) + 绿 (G) = 黄 (Y)红 (R) + 蓝 (B) = 品红 (M)绿 (G) + 蓝 (B) = 青 (C)红 (R) + 绿 (G) + 蓝 (B) = 白 (W)
这里,颜色之间加法的含义是,如果同时把等式左边两种颜色的「灯光」打到一起,我们通过肉眼,就会看到等式右边的颜色。
由上面的加色公式,我们可以很容易的得到下列补色
黄 (Y) = 白 (W) - 蓝 (B)品红 (M) = 白 (W) - 绿 (G)青 (C) = 白 (W) - 红 (R)
即,(黄, 蓝)、(品红, 绿)、(青, 红) 分别是三对补色。这也意味着,任何一对补色的光相叠加,我们会重新得到白光。
然后我们再来看下 CMYK 下的颜色合成公式
黄 (Y) + 品红 (M) = 红 (R)黄 (Y) + 青 (C) = 绿 (G)青 (C) + 品红 (M) = 蓝 (B)
减色模式下的叠加,意味着把等式左边两种颜色的「颜料」混合到一起,我们能看到等式右边颜色的颜料被合成了。
可以看到, CMY 之间的两两组合让我们重新获得了 RGB。看着很神奇,但其实只要使用上面提到的「补色」,就能轻松理解这里面的原因。
以 黄 (Y) + 品红 (M) = 红 (R)
为例,通过将等式左边的颜色转为补色表示,我们可以的到:
黄 + 品红= [ 白 - 蓝 ] + [ 白 - 绿 ]= 白 - 蓝 - 绿= 红
用文字来表达就是,如果我们把一个吸收蓝光的颜料,和一个吸收绿光的颜料进行混合,那我们就会的到一个吸收蓝光加绿光,也就是只反射红光的颜料。
上面我们说到了三原色的颜色合成。需要注意的是,三原色合成出来的依然是纯色。
从上图中抽离出 RGB 三原色,那么顺序是这样的:
红 - 绿 - 蓝 - 红
红和绿之间混合出黄,绿蓝之间混合出青,蓝红之间混合出品红。
发现没有,纯色全部都是从 RGB 中抽出两个颜色进行混合。那问题来了,将三种颜色混在一起会是什么效果呢?这里我们需要介绍另外3种合成颜色的方法:
在绘画调颜料的时候,减淡一个颜色最好的方法,就是往里加入白色。同样的,在 RGB 的模式下,让一个颜色减淡的方法,就是让这个颜色往白色去靠,并且是 R、G、B 都按照同一个比例去变化。
NewColor = OldColor + (255 - OldColor) * TintFactor
减淡的效果,既可以理解为往颜料里加入白色颜料,也可以理解为在原来的光线中增加了白光。
在绘画调颜料的时候,加深一个颜色最好的方法,就是往里加入黑色。同样的,在 RGB 的模式下,让一个颜色加深的方法,就是让这个颜色往黑色去靠,和减淡一样,R、G、B 要按照同比例去变化.
NewColor = OldColor * (1 - ShadeFactor)
在绘画调颜料的时候,让一个颜色变灰的方法,顾名思义,就是加入灰色的颜料。而在 RGB 中,变灰的方法,就是同时使用「减淡」和「加深」。
NewColor = OldColor * (1 - TintColor) * (1 - ShadeColor) + 255 * TintColor * (1 - ShadeColor)
HSB 有时也会写成 HSV。这么多字母,让我们先来看下,每个字母都是什么含义。
HSB,HSL的实用价值在于,这种表示方法更符合人类对颜色的认知。看到春天刚长出的柳芽,我们知道那是嫩绿色的;看到松树的叶子,我们知道那是深绿色的。虽然两个颜色不同,但是那同样是绿色,只是颜色深浅不同。
总结下我们看待一个颜色的步骤:
这个步骤,是不是和我们上面介绍的合成颜色的步骤(加深,减淡)很像?有了之前的铺垫,下面介绍下分别如何理解 HSB 和 HSL。
使用 HSB 颜色模式的主要是 Photoshop 里颜色选择。
使用 HSL 颜色模式的主要有 Photoshop 里的色相饱和度调整、CSS3。
全称 CIE Lab 颜色空间,这是一个按照人对颜色的感知来设计的颜色空间,且和 RGB、CMYK 相比,这是一个设备无关的颜色空间。
Lab 是一个比 RGB (sRGB, Adobe RGB) ,CMYK 都要大的颜色空间。它在设计之处的目的就在于:
从下图的球形结构中可以知道,该球的中心位置在 Lab(50, 0, 0),对应到三原色是 RGB(119, 119, 119) 或者 #777777
在实际使用中,Lab 颜色空间有什么用呢?
我们在上面已经说到了很多颜色空间,其中除了 Lab 是设备无关的颜色空间外,其他诸如 RGB、CMYK 的颜色空间,都是设备相关的。
像 RGB 这样的颜色,它只是定义了如何通过三个数字去对应颜色,但并没有绝对明确地说应该对应到哪个颜色,比如我们知道 RGB(255, 0, 0) 应该对应到红,但是到底多红呢? RGB 本身并没有定义。
看到问题所在了吗?我们最终看到的颜色,是一个「绝对的颜色」,但是我们在生产图片和视频的时候,用的可能却是一个「相对的颜色」。也就是说,有可能在 Photoshop 里我设置了一个 RGB(255, 0, 0) 最红的背景色,但实际在某个投影仪上,观众可能觉得这颜色还不够红。
所以怎么办呢?我们可以把这个想象成出国旅游,进入一个国家时,我们需要先还钱。在图像的世界里,设备就是国家,比如手机屏幕、显示器、投影仪、打印机;钱就是颜色数据。
这个汇兑的过程,是如何完成的呢?整个过程要从保存图片开始,到展示图片为止。
sRGB / CMYK 等 ==(描述)==> CIE XYZ / CIE Lab ==(校准)==> 设备颜色。
而在这「描述」和「校准」的时候,用到的都是一个叫做 ICC Profile 的东西。无论你使用的是 Windows,还是 Mac,你的系统里都会有一个或多个专门的目录来存放 ICC Profile。
理论上,从光转化成数字存储,需要经过一次 ICC Profile 的 encode,然后从数字存储到重现成影响,还需要经过一次 ICC Profile 的转化。典型的例子就是,数码相机拍完一张照片,然后用打印机打印。
很好理解的是,不同设备,比如不同数码相机拍出的照片,需要不同的 ICC Profile 进行转化。而更进阶一点的摄影爱好者,可能会制作不同光照环境下的 ICC Profile 来获得更还原真是的照片效果。
对于 ICC Profile 的应用,最直观的就是在 Photoshop 里,在创建文件和打印文件的时候,都可以选择不同的 Profile。
对于设计师的实际工作中来说,颜色输出是否准确是一个非常关键的事情,而只有准确把我颜色管理,才能让你的设计在各种设备间无缝转移。所以,一定要重视颜色管理,重视 ICC Profile
原本想把各颜色空间中的颜色转换算法贴出来,不过赶巧搜到了一位大牛已经写好库,所以就直接贴一下链接,对计算机相关感兴趣的可以去看看。
https://github.com/nullice/ColorRNA
相信你已经发现了,颜色理论相关的知识相当庞杂,其中还有很大一部分设计到数学公式转化、计算机存储处理的部分,也是笔者感兴趣的部分,限于篇幅,这些等有机会再做整理。
感谢能读到最后的各位。
著作权归作者所有
联系客服