HSL (kleurruimte)

Van Wikipedia

HSL (of HLS, van het Engelse: Hue, Saturation, Lightness) is een kleurruimte die gebruikt wordt om kleuren te definiëren, en om om te zetten van/naar RGB-kleuren. De term 'Lightness' wordt soms verwisseld met 'Luminance' of 'Intensity'. Dit laatste geeft de afkorting HSI, waarmee dus ditzelfde systeem wordt bedoeld. HSV (=HSB) is een ander kleursysteem met een vergelijkbare opzet en gebruik.

[bewerk] Drie dimensies

3D-kleurenkegel

Het weergeven van kleuren met de drie dimensies, zoals in HSL, levert een driedimensionaal model op (vandaar: ruimte) waarin elke kleur een eigen punt heeft. Zo is de RGB-kleurruimte een kubus, met op elke kleur-as Rood, Groen, Blauw een intensiteit van die kleur (0-100%, of hexadecimaal 00-FF). De HSL-ruimte heeft de vorm van een dubbele kegel. De twee toppen vertegenwoordigen zwart en wit. De dimensies zijn:

Hue (Nederlands: tint), is wat we gewoonlijk 'kleur' noemen.

In het HSL-model is de kleur uitgezet in een cirkelvorm om de centrale as. Het aantal graden geeft eenduidig een tint aan. Een volle omgang van 360^o over zo'n cirkel doorloopt precies de kleuren van de regenboog.

Saturation (Nederlands: verzadiging).

De verzadiging wordt aangegeven als de afstand tot de centrale as, in procenten (100% = de buitenrand halverwege; 0% is de centrale as, die alleen maar grijs is).

Lightness (Nederlands: helderheid, lichtheid, grijsheid) is de licht/donkerheid van een kleur, lopend van zwart naar wit.

Deze maat wordt aangegeven op de centrale as van het model, in procenten (100% = de witte top).

[bewerk] Omzetten van RGB naar HSL

Vanuit een RGB=-kleur kan de HSL-waarde als volgt berekend worden. (PM formule Hue-waarde nog in te vullen; evt uit HSV/HSB-artikel)

$S a t u r a t i o n$	$= max{R, G, B} - min{R, G, B}$
$L i g h t n e s s$	$= \frac{\max \{R,G,B\} + \min \{R,G,B\}}{2}$

De HSV/HSB-waarden verschillen niet in Hue-waarde, maar wel in S- en V-waarde:

HSV/HSB:

$S a t u r a t i o n$	$= \frac{\max\{R,G,B\} - \min\{R,G,B\}}{\max\{R,G,B\}}$
$V a l u e$	$= max{R, G, B}$

[bewerk] Vergelijking van HSL en HSV/HSB

De definitie van de H-waarde is identiek. De begrippen Saturation zijn verschillend (hoewel wel met hetzelfde woord); de derde component is verschillend en heeft een andere naam: Lightness versus Value.

HSL komt in het gebruik sterk overeen met HSV/HSB. HSL heeft een (nog) betere weergave van en onderscheid tussen de menselijke begrippen 'verzadiging' en 'helderheid'. Daarom ook wordt HSL verkozen door ontwerpers en artiesten.

Computertoepassingen die HSL gebruiken:
- Inkscape (vanaf versie 0.42)
- Paint Shop Pro
- Windows kleurkiezer systeemkleuren
- De CSS3 specificatie

Computertoepassingen die HSV/HSB gebruiken zijn:
- Adobe graphic applications (Illustrator, Photoshop en andere)
- GIMP
- Apple Mac OS X kleurkiezer systeemkleuren
- Xara Xtreme

[bewerk] Voorbeelden

*RGB (100%)**	RGB (dec)	HSL	HSV/HSB	Resultaat
(1, 0, 0)	(255, 0, 0)	(0°, 1, 0.5)	(0°, 1, 1)
(0.5, 1, 0.5)	(127, 255, 127)	(120°, 0.5, 0.75)	(120°, 0.5, 1)
(0, 0, 0.5)	(0, 0, 127)	(240°, 0.5, 0.25)	(240°, 1, 0.5)