|
The HLS color space, also called HSL, stands for "Hue, Saturation, Lightness". While HSV (Hue, Saturation, Value) can be viewed graphically as a color cone or hexcone, HSL is drawn as a double cone or double hexcone. Both systems are non-linear deformations of the RGB colour cube. The two apexes of the HLS double hexcone correspond to black and white. The angular parameter corresponds to hue, distance from the axis corresponds to saturation, and distance along the black-white axis corresponds to lightness.
Difference between HSL and HSV
Both the HSL color space and the HSV color space have a common definition of hue, but not saturation and lightness/value.
HSL:
saturation = max(R,G,B) - min(R,G,B)
lightness = (max(R,G,B) + min(R,G,B)) / 2
HSV:
saturation = (max(R,G,B) - min(R,G,B)) / max(R,G,B)
value = max(R,G,B)
Examples
| RGB
| HSL
| HSV
| Result
|
| (1, 0, 0)
| (0°, 1, 0.5)
| (0°, 1, 1)
|
|
| (0.5, 1, 0.5)
| (120°, 0.5, 0.75)
| (120°, 1, 1)
|
|
| (0, 0, 0.5)
| (240°, 0.5, 0.5)
| (240°, 1, 0.5)
|
|
See also
- Color space, RGB color space, HSV color space, CMYK
External link
- An explanation of HSL and how it differs from RGB can be found in the W3C's CSS3 Color Module (http://www.w3.org/TR/css3-color/#hsl-color).
- Formulas for converting to and from RGB can be found on EasyRGB.com (http://www.easyrgb.com/math.php?MATH=M19#text19).
|
