RGB、HSB\HSV、HSL三种颜色空间的原理理解与转换

『"Color" refers to the human brains subjective interpretation of combination of a narrow band of wavelength of light』---- WIKIBOOKS

简单说来,颜色是人脑对不同波段光长的主观理解。

----------------------------------Primary Colors------------------------------------

元色,这个可以理解为向量空间的基。

也就是说一个颜色空间的所有色彩都可以通过这个空间的元色通过某种方式生成。(简单的就是线性相加,比如rgb空间)


Tranditional Colors

站在巨人肩上的巨人大牛顿在1672年使用,红、黄、蓝做为三元色。这组组合也被称为"Painter's Colors",现在仍在使用。

但这种组合并不能完全生成所有的颜色。


Subtractive Colors

应用减法框架的颜色空间,三元色:蓝绿、黄色和洋红(cyan, yellow and magenta)。

这种框架下的颜色是,使用白光减去三种光源成份得到色彩。如下图:




Additive Colors

应用加法的颜色空间,其中的颜色由原色相加得到。比如我们常见的RGB(Red, Green, Blue)。





----------------------------------HSL------------------------------------

H指Hue,可以理解为区别颜色的名称、类型,比如黄色、蓝色等。

S指Saturation,指颜色的『丰满』程度,该值越大,颜色越艳丽。

L指Lightness,指亮度。从黑到白。


三者之间的关系是:

该颜色空间中,心Lightness为轴心;Hue围绕L旋转过程中颜色发生变化;每一个与L正交的平面上,以交点为中心向某方向(H)发射的射线是S。


我觉得colorizer.org上面的图挺形象,搬过来如下:






----------------------------------HSB与HSV------------------------------------

注意,这两个东西是大大滴不同。

这两者里面的Hue都是指的同一个拿含意(可以理解成颜色类型),可以用下面这个色环表示:



但它们的其它两维(尤其是saturation)所指的含义却差别很大。

在HSL中:

Lightness控制颜色,从黑到hue再到白。颜色的明亮程度完全靠L控制。

Saturation控制颜色的灰度冷暖。


但在HSB中:

同一Hue颜色的冷暖、色调、明暗受Saturation和Brightness(value)共同影响。

下面这两幅图对比比较明显。



可以在http://colorizer.org/尝试调整不同维度值,感受颜色变化。



----------------------------------转换公式------------------------------------

RGB 到 HSB\HSV


RGB 到 HSL



其中,M = max(R, G, B), m = (R, G, B)。


HSB\HSV 到HSL



HSL 到 HSV\HSB








参考:http://colorizer.org/

https://en.wikipedia.org/wiki/HSL_and_HSV

https://en.wikibooks.org/wiki/Color_Models:_RGB,_HSV,_HSL

http://codeitdown.com/hsl-hsb-hsv-color/


  • 4
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
RGB(Red, Green, Blue)和HSB(Hue, Saturation, Brightness)都是常用的颜色模型。RGB模型是基于颜色的三个基本分量,即红色、绿色和蓝色,而HSB模型则是基于颜色的色相、饱和度和亮度。 RGB转换HSB的数学原理如下: 1. 首先需要将RGB转换为0-1的标准化值。假设原始颜色的RGB值为(r, g, b),则对应的标准化值为: r' = r / 255 g' = g / 255 b' = b / 255 2. 计算色相H。色相是指颜色在色轮上的位置,取值范围为0-360度。具体计算方式如下: - 如果最大值和最小值相等,那么色相H为0。 - 如果最大值是红色分量r,那么色相H的计算公式为:H = (g' - b') / (max(r', g', b') - min(r', g', b')) * 60 - 如果最大值是绿色分量g,那么色相H的计算公式为:H = ((b' - r') / (max(r', g', b') - min(r', g', b')) + 2) * 60 - 如果最大值是蓝色分量b,那么色相H的计算公式为:H = ((r' - g') / (max(r', g', b') - min(r', g', b')) + 4) * 60 需要注意的是,由于色相的取值范围是0-360度,所以如果计算出来的H值小于0,需要加上360度。 3. 计算饱和度S。饱和度是指颜色的纯度,取值范围为0-100%。具体计算方式如下: S = (max(r', g', b') - min(r', g', b')) / max(r', g', b') * 100 4. 计算亮度B。亮度是指颜色的明亮程度,取值范围为0-100%。具体计算方式可以参考我之前回答问题中的内容。 通过以上计算,可以得到HSB模型中的色相H、饱和度S和亮度B值。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值