HSL

Je zkratkou pro „Hue, Saturation, Lightness“.

HSL je barevný model, který definuje barvy jako soubor tří vlastností, podobně jako barevný model RGB. Nejprve určí bod na barevném kruhu a poté upraví sytost a světlost, aby vytvořil výslednou barvu. Grafičtí a weboví návrháři ho často používají, protože umožňuje snadněji provádět drobné úpravy barev, aniž by bylo nutné použít výběr barvy.

Namísto znázornění barvy jako směsi jiných barev, jako je tomu u barevného modelu RGB, používá HSL k definování barvy tři vlastnosti: odstín, sytost a světlost:

• Odstín představuje úhlovou pozici na barevném kruhu jako číslo od 0 do 359º. Čistě červená barva se nachází nahoře na kruhu a představuje ji úhlová hodnota 0º; azurová je na opačném konci při hodnotě 180º.
• Sytost představuje intenzitu barvy jako procento od 0 do 100 %. Při sytosti 0 % vznikne šedá barva.
• Světlost představuje světlost barvy jako procento od 0 do 100 %. Světlost 0 % znamená černou, světlost 50 % samotnou barvu a světlost 100 % bílou.

Barevný model HSL dokáže vytvořit stejný rozsah barev jako RGB, pouze v jiném formátu. Například světle azurová barva s hodnotami RGB R:166, G:242, B:242 nebo s (hexadecimální hodnotou #A6F2F2) je stejná jako barva s odstínem 180º, sytostí 75 % a světlostí 80 %. Digitální obrazové soubory stále ukládají informace o barvách jako hodnoty RGB, i když editor obrázků používá HSL.

HSL se považuje za intuitivnější způsob definování barev pomocí souboru čísel. Weboví návrháři často zadávají barvy v CSS pomocí HSL namísto RGB, aby zjednodušili drobné úpravy. Pokud například webový návrhář zadal barvu pomocí kódu CSS hsl(180, 75%, 80%), může ji ztmavit snížením čísla světlosti. Pokud by se o stejnou úpravu pokusil pomocí hodnot RGB, musel by změnit všechny tři hodnoty o různé částky.

NOTE: Barevný model HSL je podobný modelu HSB. HSB používá stejný výpočet odstínu, ale místo světlosti používá jas — hodnota 100 tak představuje plnou barvu namísto bílé, což také ovlivňuje výpočet sytosti.