HEX kód složí tři 8bitová čísla do šesti hexadecimálních číslic. Převod z HEX na RGB znamená rozdělit tyto číslice do párů a číst každý pár jako desetinné číslo mezi 0 a 255 — přesně hodnoty, které očekává CSS, Figma a grafické editory.
Jak funguje převod z HEX na RGB
- Odeber úvodní # a pokud kód má jen tři číslice, zdvoj každou: #f53 se změní na #ff5533.
- Rozděl šest číslic do tří párů — RR, GG a BB.
- Přečti každý pár jako číslo v základu 16 a převed ho do základu 10: FF je 255, 57 je 87, 33 je 51.
- Zapiš tři výsledky jako rgb(R, G, B).
Ukázkový příklad
Tento převod je přesný. HEX a RGB popisují stejné sRGB hodnoty v odlišném zápisu, takže se nic nezakulatí ani neztratí v žádném směru.
HEX a RGB vysvětleno
Co je HEX?
HEX kód je šestimístné hexadecimální číslo, které po úvodním # uchovává červený, zelený a modrý kanál barvy. Každý pár číslic pokrývá jeden kanál od 00 (žádný) po FF (plný), což dává stejných 16,7 milionu barev jako RGB, ale v kratším zápisu. HEX je výchozí v CSS, designových nástrojích a styleguidu značky.
- Syntaxe:
- #RRGGBB
- Rozsah:
- 00–FF na kanál
- Nejlepší pro:
- CSS, předání designu, brand guidelines
Co je RGB?
RGB popisuje barvu třemi kanály světla — červená, zelená a modrá — každý v rozsahu 0 až 255. Odráží skutečné fungování obrazovek: všechny tři na 255 dají bílou, všechny na 0 dají černou. RGB je správná volba vždy, když s barvou potřebuješ počítat; rgba() navíc přidává průhlednost.
- Syntaxe:
- rgb(R, G, B)
- Rozsah:
- 0–255 na kanál
- Nejlepší pro:
- kód, canvas, průhlednost s rgba()
Referenční tabulka HEX na RGB
Nejběžnější CSS barvy převedené z HEX na RGB.
| Barva | 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) |