HEX kód zabalí tri 8-bitové čísla do šiestich hexadecimálnych číslic. Prevádzať HEX na RGB znamená rozdeliť tieto číslice do párov a každý pár prečítať ako desatinné číslo medzi 0 a 255 — presne také hodnoty, ktoré očakáva CSS, Figma a grafické editory.
Ako funguje konverzia z HEX na RGB
- Odstráň úvodné # a ak má kód len tri číslice, zdvoj každú z nich: #f53 sa stane #ff5533.
- Rozdeľ šesť číslic do troch párov — RR, GG a BB.
- Prečítaj každý pár ako číslo v základe 16 a preveď ho do základu 10: FF sa stane 255, 57 sa stane 87, 33 sa stane 51.
- Zapíš tri výsledky ako rgb(R, G, B).
Príklad
Tento prevod je presný. HEX a RGB opisujú tie isté sRGB hodnoty inou notáciou, takže nič sa nezaokrúhľuje ani nestráca v žiadnom smere.
HEX a RGB vysvetlené
Čo je HEX?
HEX kód je šestciferné hexadecimálne číslo, ktoré uchováva červený, zelený a modrý kanál farby za úvodným #. Každý pár číslic reprezentuje jeden kanál od 00 (žiadny) po FF (plný), čo dáva rovnakých 16,7 milióna farieb ako RGB v kompaktnejšom tvare. HEX je predvolený v CSS, dizajnových nástrojoch a brand manuáloch.
- Syntax:
- #RRGGBB
- Rozsah:
- 00–FF na kanál
- Najvhodnejšie pre:
- CSS, odovzdanie dizajnu, brand manuály
Čo je RGB?
RGB popisuje farbu troma kanálmi svetla — červená, zelená a modrá — každý v rozsahu 0 až 255. Odráža to, ako obrazovky skutočne fungujú: všetky tri na 255 dávajú bielu, všetky na 0 dávajú čiernu. RGB je správna voľba vždy, keď potrebuješ s farbou počítať, a rgba() pridáva priehľadnosť navrch.
- Syntax:
- rgb(R, G, B)
- Rozsah:
- 0–255 na kanál
- Najvhodnejšie pre:
- kód, canvas, priehľadnosť s rgba()
Referenčná tabuľka HEX → RGB
Najbežnejšie CSS farby prevedené z HEX na RGB.
| Farba | HEX | RGB |
|---|---|---|
| black | #000000 | rgb(0, 0, 0) |
| white | #FFFFFF | rgb(255, 255, 255) |
| red | #FF0000 | rgb(255, 0, 0) |
| lime | #00FF00 | rgb(0, 255, 0) |
| blue | #0000FF | rgb(0, 0, 255) |
| yellow | #FFFF00 | rgb(255, 255, 0) |
| orange | #FFA500 | rgb(255, 165, 0) |
| teal | #008080 | rgb(0, 128, 128) |
| purple | #800080 | rgb(128, 0, 128) |
| gray | #808080 | rgb(128, 128, 128) |