1. 程式人生 > >RGB、HSB\HSV、HSL三種顏色空間的原理理解與轉換

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)共同影響。

下面這兩幅圖對比比較明顯。



----------------------------------轉換公式------------------------------------

RGB 到 HSB\HSV


RGB 到 HSL


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

HSB\HSV 到HSL


HSL 到 HSV\HSB