色彩空间中的HSL、HSV、HSB有什么区别？_hsb和hsv有什么区别-CSDN博客

作者：大蔚陈
链接：https://www.zhihu.com/question/22077462/answer/29483467
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

这是特别容易混淆的几个概念。

RGB 是对机器很友好的色彩模式，但并不够人性化，因为我们对色彩的认识往往是”什么颜色？鲜艳不鲜艳？亮还是暗？”。HSL 模式和 HSV(HSB) 都是基于 RGB 的，是作为一个更方便友好的方法创建出来的。

HSB 为色相，饱和度，明度，
HSL 为色相，饱和度，亮度，
HSV 为色相，饱和度，明度。

HSB 和 HSV 是是一样的，只是叫法不同，HSL 则还有一些细微的区别：

在所有的情况下，H(Hue) 代表色相，S(Saturation) 代表饱和度。Hue（色相）是指取值范围在0-360°的圆心角，每个角度可以代表一种颜色。B 在 HSB 模式中是 Brightness 的意思, V 在 HSV 中是值，但是所表述的是一个东西：对光的量或光源的功率的感知。色相和明度（值）可以在0 - 1或者0% - 100%间取值。

HSL 稍微有一些不同，Hue（色相）和 HSB/HSV 模式中一样用数值表示，但是， S，同样代表“饱和度”，定义不一样，且需要转换。 L 代表亮度，和 Brightness/Value 不一样。Brightness（明度）是被认为是”光的量“，可以是任何颜色。

而 Lightness（亮度）是作为”白的量“来理解的。Saturation（饱和度）不一样，因为在两个模型中，饱和度都按比例缩放以适应明度或亮度的定义。

两者的区别，和他们之间对于饱和度的定义的不同。咱们拿案例看吧，先选同一个色 #f200ff

放入 HSL Color Picker，显示 HSL 数值为：H(297), S(100), L(50)

&amp;lt;img src="https://i-blog.csdnimg.cn/blog_migrate/256ef21e204751583e07ffe9471108e3.png" data-rawwidth="771" data-rawheight="361" class="origin_image zh-lightbox-thumb" width="771" data-original="https://pic3.zhimg.com/4af6abf0370ee6b6dc0f03716cba7f26_r.jpg"&amp;gt;

但是我们放在 Sketch 里面看一下，显示的 HSB 数值为，H(297), S(100), B(100) ：

&amp;lt;img src="https://i-blog.csdnimg.cn/blog_migrate/84b18dd82068398895719aac438e737a.png" data-rawwidth="214" data-rawheight="423" class="content_image" width="214"&amp;gt;