The conversion algorithms for these color spaces are originally
from the book
Fundamentals of Interactive Computer Graphics by Foley and van Dam
(c 1982, Addison-Wesley). Chapter 17 describes color spaces and shows
their relationships via easy-to-follow diagrams. NB this is
a wonderful book, but if you are going to get a copy, I suggest you look
for the latest edition.
RGB - HSL
- Convert the RBG values to the range 0-1
Example: from the video colors page, colorbar red has R=83%, B=7%,
G=7%, or in this scale, R=.83, B=.07, G=.07
- Find min and max values of R, B, G
In the example, maxcolor = .83, mincolor=.07
- L = (maxcolor + mincolor)/2
For the example, L = (.83+.07)/2 = .45
- If the max and min colors are the same (ie the color is
some kind of grey), S is defined to be 0, and H is undefined but in
programs usually written as 0
- Otherwise, test L.
If L < 0.5, S=(maxcolor-mincolor)/(maxcolor+mincolor)
If L >=0.5, S=(maxcolor-mincolor)/(2.0-maxcolor-mincolor)
For the example, L=0.45 so S=(.83-.07)/(.83+.07) = .84
- If R=maxcolor, H = (G-B)/(maxcolor-mincolor)
If G=maxcolor, H = 2.0 + (B-R)/(maxcolor-mincolor)
If B=maxcolor, H = 4.0 + (R-G)/(maxcolor-mincolor)
For the example, R=maxcolor so H = (.07-.07)/(.83-.07) = 0
- To use the scaling shown in the video color page, convert L and S
back to percentages, and H into an angle in degrees (ie
scale it from 0-360). From the computation in step 6, H will range from
0-6. RGB space is a cube, and HSL space is a double hexacone,
where L is the principal diagonal of the RGB cube. Thus corners of the RGB
cube; red, yellow, green, cyan, blue, and magenta, become the vertices of the
HSL hexagon.
Then the value 0-6 for H tells you which section
of the hexgon you are in. H is most commonly given as in degrees, so to
convert
H = H*60.0
If H is negative, add 360 to complete the conversion.
HSL - RGB
- If S=0, define R, G, and B all to L
- Otherwise, test L.
If L < 0.5, temp2=L*(1.0+S)
If L >= 0.5, temp2=L+S - L*S
In the colorbar example for colorbar green, H=120, L=52, S=79, so
converting to the range 0-1, L=.52, so
temp2=(.52+.79) - (.52*.79) = .899
- temp1 = 2.0*L - temp2
In the example, temp1 = 2.0*.52 - .899 = .141
- Convert H to the range 0-1
In the example, H=120/360 = .33
- For each of R, G, B, compute another temporary value, temp3, as
follows:
for R, temp3=H+1.0/3.0
for G, temp3=H
for B, temp3=H-1.0/3.0
if temp3 < 0, temp3 = temp3 + 1.0
if temp3 > 1, temp3 = temp3 - 1.0
In the example, Rtemp3=.33+.33 = .66, Gtemp3=.33, Btemp3=.33-.33=0
- For each of R, G, B, do the following test:
If 6.0*temp3 < 1, color=temp1+(temp2-temp1)*6.0*temp3
Else if 2.0*temp3 < 1, color=temp2
Else if 3.0*temp3 < 2, color=temp1+(temp2-temp1)*((2.0/3.0)-temp3)*6.0
Else color=temp1
In the example,
3.0*Rtemp3 < 2 so R=.141+(.899-.141)*((2.0/3.0-.66)*6.0=.141
2.0*Gtemp3 < 1 so G=.899
6.0*Btemp3 < 1 so B=.141+(.899-.141)*6.0*0=.141
- Scale back to the range 0-100 to use the scaling shown in the
video color page
For the example, R=14, G=90, B=14
Color in video