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.
Drie dimensies thumb|300px|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° 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).
Omzetting van RGB naar HSL Voor deze omzetting geldt het volgende: De RGB-kleuren R, G, B hebben elk een waarde in het bereik [0, 1] (dus delen door 255). MAX en MIN zijn respectievelijk maximum en minimum van deze drie waarden (R, G, B).
De drie waarden in H, S, L zijn dan als volgt te bepalen:
De resulterende waarden zijn H (∈ [0, 360]; of vaker rond = modulo 360), S en L (ieder ∈ [0, 1]).
Bijzondere uitkomsten: (Vooraf, voor correcte doorloop functies.) Als MAX = MIN, dan geldt S = 0. Dit is een grijskleur, waarin geen tint (H) zichtbaar is. Dit kan dan elke tint zijn zonder effect. Als MAX = 0 dan geldt L = 0. Dit is zwart, en zowel tint als verzadiging hebben geen effect. 'Er is maar één kleur zwart'.
Omzetting van HSL naar RGB De omzetting in deze richting verloopt als volgt: Een HSL-kleur heeft de waarden H ∈ [0, 360], S ∈ [0, 1] en L ∈ [0, 1]. De RGB-waarden R, G en B zijn dan als volgt te bepalen:
En gebruik dan de volgende tabel voor toekenning van RGB-waarden: {| class="wikitable" width="30%" ! Hi || R || G || B |- | 0 || p || q || t |- | 1 || u || p || t |- | 2 || t || p || q |- | 3 || t || u || p |- | 4 || q || t || p |- | 5 || p || t || u
R, G en B zijn ∈ [0, 1]. Dit kan eenvoudig worden omgezet naar 24-bits RGB door elke waarde te vermenigvuldigen met 255.
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 kunstenaars.
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
Voorbeelden RGB (×100%) RGB (dec) HSL HSV/HSB Resultaat (1; 0; 0) (255; 0; 0) (0°; 1; ) (0°; 1; 1) (; 1; ) (127; 255; 127) (120°; ; ) (120°; ; 1) (0; 0; ) (0; 0; 127) (240°; ; ) (240°; 1; )
Categorie:Kleurruimte