HSL (TSL) coding

HSL coding

HSL coding

The HSL Model (Hue, Saturation, Luminance), based on the work of painter Albert H.Munsell (who created the Munsell Atlas), is a representation model known as “natural”, that is, close to the physiological perception of color by the human eye. Indeed, the RGB model, however well adapted it may be for the computer representation of colors or for showing them on peripheral display devices, does not allow colors to be selected easily.

Indeed, RGB color adjustment with computer tools is generally done by using three slide blocks or of three cells with the relative values for each primary component, however the lightening of a color requires the respective values of each component to be increased proportionally. Thus, the HSL model was developed in order to overcome this issue with the RGB model.

The HSL Model consists in breaking up the color according to physiological criteria:

  • Hue, corresponding to the perception of the color (mauve or orange T-shirt),
  • Saturation, describing the purity of the color, that is, its sharp or dull character (new or washed-out T-shirt),
  • Luminance, indicating the amount of light of the color, that is, its light or dark appearance (T-shirt in the sun or in the shade).

The following is a graphical representation of the HSL model, in which the color is represented by a chromatic circle and the luminance and saturation are represented by two axes:

Graphic representation of the HSL model

The HSL Model was developed with the aim of allowing fast interactive color selection; however, it is not adapted to the quantitative description of a color.

There are other natural representation models closely related to the HSL model:

  • HSB: Hue, Saturation, Brightness. The brightness describes the perception of the light emitted by a surface.
  • HSV: Hue, Saturation, Value.
  • HSI: Hue, Saturation, Intensity.
  • HCI: Hue, Chrominance, Intensity.
Ask a question
CCM is a leading international tech website. Our content is written in collaboration with IT experts, under the direction of Jean-François Pillou, founder of CCM.net. CCM reaches more than 50 million unique visitors per month and is available in 11 languages.
This document, titled « HSL (TSL) coding », is available under the Creative Commons license. Any copy, reuse, or modification of the content should be sufficiently credited to CCM (ccm.net).