当前位置：新励学网 > 秒知问答 > 色彩空间中的HSL，HSV，HSB有什么区别

色彩空间中的HSL，HSV，HSB有什么区别

发表时间：2024-07-25 19:05:54 来源：网友投稿

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

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

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

同样需要提醒一下的是，CSS里头支持的是HSL，而不是HSB，不要把HSB的数值直接套用了，不然的话你看到的可能会是不一样的颜色。

HSL和HSB哪一个更适合人机界面，是有争议的，实际运用的区别会和我上面的例子一样，具体的区别和优劣势，可移步到这看：

免责声明：本站发布的教育资讯（图片、视频和文字）以本站原创、转载和分享为主，文章观点不代表本网站立场。

如果本文侵犯了您的权益，请联系底部站长邮箱进行举报反馈，一经查实，我们将在第一时间处理，感谢您对本站的关注！