Čo je hexadecimálny kód? Všetko, čo potrebujete vedieť

Práca s farbami v HTML je pomerne jednoduchá. Pomocou niekoľkých jednoduchých deklarácií CSS môžete zmeniť farbu akéhokoľvek textu alebo pozadia na svojej webovej stránke. Ale ako určiť farbu? Odpoveď na túto otázku nás zavedie do králičej nory, ktorá nás nakoniec privedie ku konceptu hexadecimálnych farebných kódov.

Ak ste už predtým pracovali s HTML alebo CSS, pravdepodobne ste už počuli pojem hex kód. Ale čo presne je hexadecimálny kód? Aké sú niektoré príklady hexadecimálnych kódov? Aký je rozdiel medzi hexadecimálnym kódom a farebným kódom RGB?

Čo je hexadecimálny kód?

Keď prvýkrát začnete pracovať s farbou, môžete použiť grafické rozhranie na výber farieb, ktoré sa použijú na prvky na vašej stránke. Keď sa začnete pozerať na základný kód a nie len na svoj grafický editor, zistíte, že farby vyzerajú ako zvláštne vyzerajúce sekvencie znakov. Takéto sekvencie sú známe ako hexadecimálne kódy; vyzerajú asi takto:

#FF0092

Súvisiace: Základné pojmy grafického dizajnu, ktoré potrebujete vedieť

Farby v CSS môžete špecifikovať niekoľkými rôznymi spôsobmi. Môžete použiť názvy niektorých preddefinovaných farieb ako napr červená a tmavomagenta. Ak však chcete určiť presné odtiene farieb, budete musieť použiť presnejšie meranie: niečo číselné.

CSS ponúka dve hlavné možnosti: RGB a hex. V oboch formátoch určíte množstvá červenej, zelenej a modrej, ktoré tvoria konečnú farbu. RGB používa tri čísla medzi 0 a 255. Hex robí presne to isté, len s iným základom (16), ako je desatinné číslo (10), na ktoré ste zvyknutí.

Hexadecimálne číslo používa okrem číslic 0-9 aj písmená A-F, čo predstavuje celkovo 16 symbolov. A v hex je ekvivalentom 10 v desiatkovej sústave. F v hex je 15 v desiatkovej sústave.

Ako fungujú hexadecimálne farebné kódy?

Vo svojej najzákladnejšej forme je hexadecimálny kód vyjadrením toho, koľko červenej, zelenej a modrej existuje vo farbe. Hexadecimálny kód pozostáva zo šiestich znakov. Prvé dve sa týkajú množstva červenej v zmesi, ďalšie dve sa týkajú množstva zelenej a posledné dve číslice odrážajú množstvo modrej. Hexadecimálne kódy označujú konkrétne farby, čo umožňuje dizajnérom a vývojárom jednoducho komunikovať o farebných schémach.

S hodnotami 16 × 16 (256) pre každú farebnú zložku je potom 256 × 256 × 256 možných kombinácií. V hexadecimálnom zobrazení sa pohybujú od #000000 (čisto čierna) po #FFFFFF (čisto biela).

Ako čítať hexadecimálne farebné kódy

Pochopenie hexadecimálnych farebných kódov je jednoduché. Vezmime si príklad #FF5733. Najprv rozdeľte šesť znakov na tri časti, z ktorých každá obsahuje dva znaky. Ako viete, prvé dve časti predstavujú červenú, druhé dve časti zelenú a tretie dve časti modrú. Takže v našom príklade:

• Červená zložka, RR, má hodnotu FF.
• Zelená zložka, GG, je 57.
• Modrá zložka, BB, je 33.

Teraz, aby ste našli intenzitu týchto farebných segmentov, musíte vypočítať hexadecimálne číslo pomocou týchto troch krokov:

1. Vynásobte prvý hexadecimálny znak RR číslom 16. Ak je znakom písmeno, skonvertujte ho na zodpovedajúcu hodnotu. V tomto prípade je prvým znakom F, čo je 15. Takže pre náš príklad vynásobíte 15 × 16, čo sa rovná 240.
2. Potom pridajte druhý znak RR. Ak je to potrebné, znova preveďte písmeno na zodpovedajúcu hodnotu. V našom príklade je druhým znakom F, ktoré sa rovná 15.
3. Po dokončení pridajte súčty, aby ste získali jednu hodnotu. Ak pridáte 240 a 15 z nášho príkladu, uvidíte, že hodnota FF je 255.

Zopakujte rovnaký vzorec pre zostávajúce dva segmenty, GG označené 57 a BB označené 33. Ak sa vám manuálne výpočty zdajú príliš zdĺhavé, vždy môžete použiť nástroj na konverziu hex do RGB (napr BinaryHex konvertor) prečítať farbu. Mali by ste zistiť, že hexadecimálna hodnota #FF5733 je ekvivalentné rgb (255, 87, 51).

Prečo je hexadecimálny farebný kód taký populárny?

Aj keď existuje niekoľko rôznych farebných modelov (RGB, CMYK, HSL), hex kódy farieb sú možno najpoužívanejším zobrazením. Je to preto, že sú jednoduché a ľahko pochopiteľné.

Veľmi užitočný je aj formát s pevnou šírkou. Šestnástkové farby v plnej dĺžke majú vždy sedem znakov vrátane úvodných znakov # symbol.

Hexadecimálne farby sú veľmi efektívne, pretože len týchto sedem znakov predstavuje viac ako 16 miliónov farieb. A rozlišovanie medzi týmito farbami je jednoduchý proces.

Hex vs. RGB: Existuje nejaký rozdiel?

Systém farebného kódovania RGB používa tri desatinné čísla na označenie relatívnej intenzity červenej, zelenej a modrej. Používa číslice 0-9.

Hex používa tri čísla na vyjadrenie červenej, zelenej a modrej, ale používa ďalšie číslice (A-F) na pokrytie základu 16. Vo výsledných farbách nie je žiadny rozdiel, sú to jednoducho rôzne formáty na komunikáciu rovnakých informácií.

Súvisiace: Základy CSS: Práca s farbami

Na čo sa používa hexadecimálny kód?

RGB používa množstvo rôznych aplikácií, od televíznych obrazoviek až po mobilné zariadenia, hry a nápisy. Vo webovom dizajne a iných grafických programoch uvidíte hlavne hexadecimálne farebné kódy.

Môžete tiež vidieť hexadecimálne kódy ako univerzálny spôsob identifikácie farieb. Mnoho webových stránok ich používa na identifikáciu konkrétnej farby, pretože sú krátke a zvyčajne jednoznačné v kontexte.

Hexadecimálny farebný kód nie je raketová veda

Takže tu máte základy hexadecimálnych farebných kódov. Nie sú to presne tvrdá veda, ale slúžia na určitý účel v dizajne (a v technologickom svete). Ak hľadáte nástroj, ktorý vám pomôže pochopiť, ako fungujú hexadecimálne farby, alebo nástroj, ktorý vás naučí o teórii miešania RGB, existuje veľa online. Pamätajte, že kľúčom k učeniu sa čohokoľvek nového je robiť to krok za krokom.

Hexadecimálne farebné kódy nie sú tou najzaujímavejšou vecou na svete, ale ak pracujete vo webovom dizajne, je dôležité im porozumieť. Schopnosť pracovať s hexadecimálnymi farebnými kódmi vám výrazne uľahčí návrhársku prácu.

Ako nájsť hexadecimálnu hodnotu ľubovoľnej farby na obrazovke

Naučte sa, ako vybrať akúkoľvek hodnotu farby z obrazovky v priebehu niekoľkých sekúnd. Užitočné najmä pre web dizajnérov!

Prečítajte si ďalej

O autorovi