Un cod HEX grupează trei numere pe 8 biți în șase cifre hexazecimale. Conversia HEX în RGB înseamnă împărțirea acelor cifre în perechi și citirea fiecărei perechi ca număr zecimal între 0 și 255 — exact valorile pe care le așteaptă CSS, Figma și editoarele de imagine.
Cum funcționează conversia din HEX în RGB
- Elimină # de la început și, dacă codul are doar trei cifre, dublează fiecare: #f53 devine #ff5533.
- Împarte cele șase cifre în trei perechi — RR, GG și BB.
- Citește fiecare pereche ca număr în baza 16 și convertește-l în baza 10: FF devine 255, 57 devine 87, 33 devine 51.
- Scrie cele trei rezultate ca rgb(R, G, B).
Exemplu de aplicare
Această conversie este exactă. HEX și RGB descriu aceleași valori sRGB într-o notație diferită, astfel nimic nu se rotunjește sau se pierde în niciuna din direcții.
HEX și RGB, explicate
Ce este HEX?
Un cod HEX este un număr hexazecimal de șase cifre care stochează canalele roșu, verde și albastru ale unei culori, precedat de #. Fiecare pereche de cifre reprezintă un canal, de la 00 (niciunul) la FF (maxim), oferind aceleași 16,7 milioane de culori ca RGB, dar într-o notație mai scurtă. HEX este implicitul în CSS, în instrumentele de design și în ghidurile de brand.
- Sintaxă:
- #RRGGBB
- Interval:
- 00–FF per canal
- Ideal pentru:
- CSS, predare design, ghiduri de brand
Ce este RGB?
RGB descrie o culoare ca trei canale de lumină — roșu, verde și albastru — fiecare între 0 și 255. Reflectă modul în care funcționează ecranele: toate la 255 dau alb, toate la 0 dau negru. RGB e alegerea potrivită când trebuie să calculezi cu o culoare, iar rgba() adaugă transparență peste.
- Sintaxă:
- rgb(R, G, B)
- Interval:
- 0–255 per canal
- Ideal pentru:
- cod, canvas, transparență cu rgba()
HEX în RGB tabel de referință
Cele mai comune culori CSS, convertite din HEX în RGB.
| Culoare | 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) |