Nástroj na výber farieb - Konverzia RGB, Hex, CMYK a HSV farebných kódov

Čo je nástroj na výber farby?

Nástroj na výber farby slúži na výber farby a zobrazenie jej hodnoty v rôznych farebných formátoch. Tento nástroj zobrazuje farbu súčasne v modeloch RGB (červená, zelená, modrá), hex, CMYK (azúrová, purpurová, žltá, čierna) a HSV (odtieň, sýtosť, hodnota). Zmena ktoréhokoľvek formátu okamžite aktualizuje ostatné.

Ako používať výber farby

Farbu možno vybrať tromi spôsobmi.

Kliknutím kamkoľvek do spektrálneho poľa vyberiete odtieň a sýtosť. Vodorovná poloha určuje odtieň, teda farebnú skupinu, napríklad červenú alebo modrú. Zvislá poloha určuje sýtosť, či farba pôsobí výrazne alebo vyblednuto. Posuvník pod spektrom ovláda jas, od čiernej naľavo po úplný jas napravo.

Funguje aj zadávanie presných hodnôt. Pole hex prijíma kódy, napríklad #2ECC71, s # alebo bez neho. Každé pole RGB prijíma celé číslo od 0 do 255. Každé pole CMYK prijíma celé číslo od 0 do 100. Hodnota zadaná nad povoleným rozsahom sa nastaví na maximum.

Každý farebný formát má vedľa seba tlačidlo na kopírovanie. Kliknutím sa daná hodnota skopíruje do schránky a zobrazí sa krátka správa „Skopírované!“.

Vysvetlenie farebných modelov

RGB

RGB opisuje farbu ako zmes červeného, zeleného a modrého svetla, teda rovnakých troch farieb, ktoré obrazovka používa na vytvorenie každého obrazového bodu. Každý kanál má rozsah od 0 do 255. RGB(255, 0, 0) je čistá červená a RGB(0, 0, 0) je čierna. Prehliadače, aplikácie aj softvér na spracovanie videa používajú RGB, pretože zodpovedá fungovaniu obrazoviek.

Hex

Hexadecimálny kód zapisuje farbu RGB v číselnej sústave so základom 16 namiesto sústavy so základom 10. #2ECC71 obsahuje tri dvojice znakov: 2E pre červenú, CC pre zelenú a 71 pre modrú. Každá dvojica má rozsah od 00 do FF. Hexadecimálne kódy sú bežné pri tvorbe webov, pretože CSS ich prijíma priamo a zapisujú sa kratšie než rgb(). Existuje aj trojznaková skratka: #0F0 znamená to isté ako #00FF00.

CMYK

CMYK sa používa pri tlači. Tlačiareň vytvára farbu vrstvením azúrového, purpurového, žltého a čierneho atramentu na biely papier, takže funguje odčítaním svetla, nie jeho sčítaním. Každý kanál je percentuálna hodnota od 0 do 100. CMYK(0, 0, 0, 0) znamená úplnú absenciu atramentu, takže zostane viditeľný biely papier. CMYK nedokáže reprodukovať každú farbu, ktorú môže zobraziť obrazovka; niektoré jasné farby obrazovky, najmä určité modré a zelené odtiene, po vytlačení pôsobia tlmenejšie.

HSV

HSV opisuje oddelene odtieň, sýtosť a hodnotu. Odtieň je farebná skupina vyjadrená v stupňoch od 0° do 360°, pričom 0° je červená, 120° zelená a 240° modrá. Sýtosť vyjadruje intenzitu farby, od 0 % (sivá) po 100 % (plne sýta farba). Hodnota vyjadruje jas, od 0 % (čierna) po 100 % (úplný jas). HSV sa približuje prirodzenému spôsobu, akým ľudia opisujú farby, preto sú na ňom založené spektrum aj posuvník jasu v tomto nástroji.

Vzorec prevodu RGB na hex

Každý kanál RGB, teda číslo od 0 do 255, sa prevedie na dvojmiestne hexadecimálne číslo a potom sa tieto tri dvojice spoja s # na začiatku.

$\text{Hex} = \text{\#} + \text{toHex}(R) + \text{toHex}(G) + \text{toHex}(B)$

Vzorec prevodu RGB na CMYK

Najprv sa každý kanál RGB prepočíta na zlomok medzi 0 a 1. Čierna (K) sa určí podľa kanála s najvyššou hodnotou. Azúrová, purpurová a žltá sa potom vypočítajú zo zostávajúcich kanálov a hodnoty K.

$R' = R/255,\quad G' = G/255,\quad B' = B/255$ $K = 1 - \max(R', G', B')$ $C = \frac{1-R'-K}{1-K}\times 100\%,\quad M = \frac{1-G'-K}{1-K}\times 100\%,\quad Y = \frac{1-B'-K}{1-K}\times 100\%$

Keď sa K rovná 1 (farba je čisto čierna), C, M aj Y sa nastavia na 0, aby sa zabránilo deleniu nulou.

Vzorec prevodu RGB na HSV

RGB sa najprv prepočíta na zlomky medzi 0 a 1. Nech $C_{max}$ označuje najväčšiu z troch hodnôt, $C_{min}$ najmenšiu a $\Delta$ rozdiel medzi nimi.

$V = C_{max}\times 100\%$ $S = 0 \text{ if } C_{max}=0,\text{ inak } \frac{\Delta}{C_{max}}\times 100\%$

Odtieň závisí od toho, ktorý kanál má najvyššiu hodnotu:

undefined