颜色模型与显示

Posted on | In , | Views:

导言

总用有五类颜色模型，分别是：
CIE, RGB, YUV, HSL/HSV, and CMYK

来自色彩空间中的HSL、HSV、HSB有什么区别？ - MoonCancer的回答 - 知乎
https://www.zhihu.com/question/22077462/answer/105844680 的回答可以很好地解释描述颜色的几个重要的方面：

色相（表，表现）：即色彩的相貌和特征。自然界中色彩的种类很多，色相指色彩的种类和名称。如；红、橙、黄、绿、青、蓝、紫等等颜色的种类变化就叫色相。
明度（表，面子）：指色彩的亮度或明度，也叫明亮度。颜色有深浅、明暗的变化。比如，深黄、中黄、淡黄、柠檬黄等黄颜色在明度上就不一样，紫红、深红、玫瑰红、大红、朱红、桔红等红颜色在亮度上也不尽相同。这些颜色在明暗、深浅上的不同变化，也就是色彩的又一重要特征一一明度变化。
色彩的明度变化有许多种情况，一是不同色相之间的明度变化。如：白比黄亮、黄比橙亮、橙比红亮、红比紫亮、紫比黑亮；二是在某种颜色中加白色，亮度就会逐渐提高，加黑色亮度就会变暗，但同时它们的纯度(颜色的饱和度)就会降低，三是相同的颜色，因光线照射的强弱不同也会产生不同的明暗变化。。
纯度（里，里子）：指色彩的鲜艳程度，也叫饱和度。原色是纯度最高的色彩。颜色混合的次数越多，纯度越低，反之，纯度则高。原色中混入补色，纯度会立即降低、变灰。物体本身的色彩，也有纯度高低之分，西红柿与苹果相比，西红柿的纯度高些，苹果的纯度低些。

所谓的颜色模型，大都是在这几个方面进行的描述。

CIE颜色模型

CIE是首个基于人类对颜色的感受来定义的颜色空间，后续也有一些改进版本，计算机视觉中接触较少，这里不多展开。

RGB颜色模型

RGB模型是最容易理解的一个颜色模型了，RGB不是一种颜色空间，而是一种颜色模型，因为RGB以及其颜色混合是符合物理意义的，它的三个值都是代表着实际的物理意义。

sRGB主要用于互联网的图片，这涉及到一个叫做gamma校正的知识点，gamma校正也是一种常见的预处理方法。gamma校正主要原因是RGB是一种线性的模型，认为(0.5, 0, 0)的颜色亮度就是(1.0, 0, 0)的一半，但是显示器实际上并不是线性的。

YUV

或者YIQ, YCbCr等。YUV中的Y是Luminance，流明，也就是明度，UV则用于指定色彩（色相）和饱和度(纯度)，YUV的产生主要是为了分离出灰度图，如果YUV只有Y，那么也是能够显示出来的，只不过只能够显示出灰度图而不带有颜色。

YCbCr是YUV的翻版，属于YUV系列，Y依然是明度，但是Cb和Cr则是蓝色色度和红色色度的分量。我们知道，灰度可以由RGB三个分量计算得出，那么如果知道RB和灰度，其实也是可以推算回来G的，这也是为什么大部分颜色空间都是三维的，因为最终基于的颜色模型就是只有三维，再怎么转换秩也不会提升，多余三维的都是因为某种目的故意添加冗余信息。

YCbCr 有许多取样格式，主要的采样格式有YCbCr 4:2:0、YCbCr 4:2:2、YCbCr 4:1:1和 YCbCr 4:4:4。其中YCbCr 4:1:1 比较常用，其含义为：每个点保存一个 8bit 的亮度值（也就是Y值），每 2x2 个点保存一个 Cr 和Cb 值，图像在肉眼中的感觉不会起太大的变化。所以，原来用 RGB(R,G,B 都是 8bit unsigned) 模型，每个点需要 8x3=24 bits（如下图第一个图）. 而使用YUV411仅需要 $8+(8/4)+(8/4)=12bits$，平均每个点占12bits。这样就把图像的数据压缩了一半。简而言之，就是认为人眼看的没那么精细，就让多个像素点共用一个颜色值来粗暴地达到压缩的效果。

  • YUV 444，未经压缩的版本
  • YUV 411, 水平每四个像素共用一个色度

  • YUV 422， 水平每两个像素共用一个色度

  • YUV 420， 这个有点特殊，也比较神奇。420不是说Cr就不要了，而是Cr和Cb轮流着要。什么意思呢，就是说，水平方向，第一行每两个像素抽一个Cr, 第二行每两个像素抽一个Cb，上下两行共享Cr和Cb，也就是说第一行用第二行的Cb, 第二行用第一行的Cr。这样子，一个2x2的像素框中，存4个Y值，1个Cr和一个Cb值，共需要六个byte， 比RGB需要的减少一倍。

HSV(又叫HSB)或者HSL

HSV(HSB)或者HSL实际上是RGB颜色模型转换到柱坐标空间。也就是说，它们并不是一种新的颜色模型，只是RGB用某种方式由柱坐标所表示出来而已，RGB对于计算机非常友好，但是对于艺术创造者就不是了，很简单的例子，没人能说请往RGB三个通道进行调整所代表的颜色变动，人眼一般只能区分颜色，亮度，饱和度这样感性的问题 。HSV转换后的空间是: H (hue), S (saturation), V (value)，最后一个值也可以叫做B (brightness)，也就是 HSV == HSB，完全只是冠名权不同。HSV更多的是被艺术创造者所使用，因为它的三个值能够最直观地反映颜色的感官的变化。

HSL和HSV非常类似，只是L代表(Lightness)，和HSV的前两个字母虽然一样，但是实际空间是不一样的，只是用了一样的名字罢了。

HSB 和 HSL 在字面意思上是一样的：

  • H 指的是色相（Hue），就是颜色名称，例如“红色”、“蓝色”；
  • S 指的是饱和度（Saturation），即颜色的纯度；
  • L（Lightness） 和 B（Brightness）是明度，颜色的明亮程度
    在原理和表现上，HSL 和 HSB 中的 H（色相） 完全一致，但二者的 S（饱和度）不一样， L 和 B （明度 ）也不一样：
  • HSB 中的 S 控制纯色中混入白色的量，值越大，白色越少，颜色越纯；
  • HSB 中的 B 控制纯色中混入黑色的量，值越大，黑色越少，明度越高
  • HSL 中的 S 和黑白没有关系，饱和度不控制颜色中混入黑白的多寡；
  • HSL 中的 L 控制纯色中的混入的黑白两种颜色。

gamma校正

当我们计算出场景中所有元素的最终颜色(RGB)后，我们必须将颜色显示到显示器上，但是显示器的显示能力是不同的，计算机的真彩色65535显示器并不能全部显示出来。显示器有一个物理特性，就是两倍的输入电压产生的并不是两倍的亮度，传统的CRT显示器输入电压产生的亮度约为输入电压（注意电压已经被归一化到0-1范围）的2.2次幂，这个2.2被称为显示器的gamma值。由gamma值我们知道显示器的亮度输出并不是线性的，线性的亮度输出需要非线性的电压调节。每一种设备都有其特定的gamma值，任何设备的gamma值基本不会等于1，等于1的设备是一种理想的线性的状态。

gamma_correction_brightness
上图是人眼感受亮度和实际物理亮度的对比，人眼对比较暗的亮度变化比较敏感，对于比较亮的部分的变化则不那么敏感，上图中上面一行是人感受到的亮度变化，而下面一行则是光子数量的变化。可以看到，上面一行亮度由0.3到0.6,视觉上相当于下面一行0.1到0.2的变化。

我们从0.1到0.2这一档就可以看出，光子数量无需增加一倍，人眼感受到的亮度已经增加了一倍。而在亮的部分，下面一行(光子数)从0.7变化到1.0, 人眼感受到的亮度变化则几乎不变。
人眼感受到的亮度这样的变化规律和显示器的gamma规律其实是非常接近的，这也是用gamma的一个原因，举个例子，假如gamma是2， 输入电压从0.1到0.2，实际上显示器显示的亮度是从$0.1^2$变成$0.2^2 = (0.1 + 0.1)^2 = 4 x 0.1^2$, 变成了四倍，而光子亮度（与电压相关）则只是增长了一倍。同样可以尝试比较下电压从0.9到1.0, 显示亮度

CRT中，物理亮度为电压的2.2次幂，而对于人眼，物理亮度也是人眼感受亮度的2次幂，这就解决了显示器亮度非线性的问题，因为非线性显示的亮度反而更加贴合人的肉眼观感，换句话说，我们只需线性变化电压即可获得线性的人眼感受亮度。在RGB颜色中，我们可以认为1就是最大电压，也就是颜色(1, 0, 0)就是强度最大的红色光。

gamma_correction_gamma_curves

在渲染图像时，又会产生另外的一种问题，这是因为大部分算法都假设是在线性空间里工作的，认为颜色的大小代表他的强度，是线性的。举个例子，(1.0, 0,0)代表红色，而(0.5, 0,0)就是强度减半的红色。不幸的是，在显示器中显示出来时，(1.0.0)依然是(1, 0, 0)但是， (0.5, 0, 0)则是(0.28, 0, 0)了，也就是强度不再是翻倍的关系，而是接近4.5倍。如果每个颜色都是人工调出来的还好，设计师的肉眼能够自动进行校正，本身就是在一个非线性的颜色空间里面工作，只要肉眼看起来强度是两倍就行了，不管实际的电压已经不是2倍关系。但是渲染还有一些计算光照等的算法可不是人眼，它假设就是颜色强度是线性的，0.5和1就能够产生强度是两倍而不是4.5倍的肉眼效果。
这就是为啥需要对颜色进行gamma校正。校正的做法就是将颜色强度首先进行一定程度的加强，然后让显示器显示出来。上图中， 为了获得线性的颜色输出，我们将(0.5, 0,0 )进行以下转换： $(0.5, 0,0)^{\frac{1}{2.2}} =(0.5, 0,0)^{0.45}=(0.73, 0,0)$。然后显示出来的时候再被显示器进行一次转换变回0.5,$(0.5, 0,0)^{\frac{1}{2.2}}*(0.5, 0,0)^{2.2} =(0.5, 0,0)$ ，这样子，我们的颜色依然可以在线性空间中计算，只是显示到显示器之前进行一次gamma校正，这样，设计师在实际设计的时候也会在线性空间中进行，算法计算出来的结果也在该空间，就不会造成冲突了。从工作原理我们可以看到，gamma校正应该只在输出到显示器之前做一次，否则进行多次gamma校正会使得强度过大而失真。

CMYK

CMKT是用于打印机的颜色模型，由于打印机是反射光，和RGB这样的光源不同，其颜色模型也是不同的，反射光用的是一种减法模型，白纸是能够反射所有光线的，颜料涂上去后，则只能反射颜料的颜色了。CMYK存储了四种基色，青色 Cyan， 品红 （magenta， 偏紫色的红色），黄色 Yellow和黑色 Dark， 我们知道，黑色就是从白色中减去所有的颜色得到的最终颜色。CMYK主要用于打印，这里不再继续展开。

0%