Farba HSL na RGB

Tvorba kanálov z HSL

Preveďte odtieň, sýtosť a svetlosť na celočíselné kanály RGB. Tento smer použite, keď návrh farby začína odtieňom a dvoma percentami, no ďalší nástroj potrebuje číselné kanály RGB. Zadajte hsl(210, 70%, 50%) alebo tie isté hodnoty oddelené čiarkami. Odtieň je od nuly do 360 stupňov; sýtosť aj svetlosť od nuly do sto percent.

Odtieň vyberie farebný sektor; chroma a svetlosť určia zaokrúhlené kanály RGB. Algoritmus vypočíta chromu zo sýtosti a svetlosti, uloží ju do sektora odtieňa a pripočíta spoločný posun na vytvorenie červenej, zelenej a modrej. Kanály zaokrúhli na celé čísla od nuly do 255. Odtieň 360 stupňov sa vráti na nulu. Pri nulovej sýtosti vznikne sivá bez ohľadu na odtieň. Na konkrétnu kontrolu dá ukážkový vstup hsl(210, 70%, 50%) výsledok rgb(38, 128, 217). Pôvodnú hodnotu si ponechajte vedľa výsledku na porovnanie v inej aplikácii.

Ako fungujú farebné modely

HEX a RGB opisujú rovnaké tri kanály aditívneho svetla. Každý kanál má celočíselnú hodnotu od nuly do 255 a hexadecimálny zápis ju vyjadruje dvoma číslicami so základom šestnásť. Šesťmiestny kód teda obsahuje dvojice pre červenú, zelenú a modrú v tomto poradí. HSL opisuje tú istú RGB farbu inak: odtieň určuje polohu na farebnom kruhu, sýtosť vzdialenosť od sivej s rovnakou svetlosťou a svetlosť polohu medzi čiernou a bielou. Tieto tvary pomáhajú porovnávať dizajnové premenné, čítať CSS a upravovať paletu.

Výber správneho zápisu

Výsledok nemá alfa kanál; nástroj používa celočíselné RGB a bežné HSL, nie profily správy farieb. Zvoľte podobu, ktorú očakáva miesto, kam výsledok vložíte. CSS prijíma hexadecimálne farby aj funkcie rgb() a hsl(), no dizajnový systém alebo grafický program môže ukladať kanály osobitne. Nástroj používa bežné výpočty sRGB; neprevádza profily obrazoviek ani nepredpovedá zobrazenie na každom monitore. Tieto trojkanálové výsledky neobsahujú priehľadnosť. Štvor- alebo osemmiestny kód s alfa kanálom potrebuje iný postup. Celočíselné kanály RGB a zobrazené desatinné hodnoty HSL sa môžu zaokrúhliť, preto spätný prevod môže zmeniť jeden kanál o jednotku. Pri prenose farby do CSS skontrolujte aj skutočnú farebnú vzorku a spôsob, akým prijímací nástroj zapisuje percentá či stupne. Tak odhalíte chybnú syntax skôr než zmení vzhľad celej palety.