Come convertire codici colore HEX in RGB
HEX e RGB sono due modi di scrivere esattamente gli stessi colori. Designer e sviluppatori passano costantemente tra i due — HEX nei fogli CSS, RGB nelle animazioni JavaScript, HSL negli strumenti di design. Capire il loro legame rende il lavoro sui colori molto più semplice.
Come funziona HEX
Un codice colore HEX come #FF5733 è un numero esadecimale a 6 cifre che rappresenta i canali rosso, verde e blu:
| Parte | Hex | Decimale | Canale |
|---|---|---|---|
| FF | FF | 255 | Rosso |
| 57 | 57 | 87 | Verde |
| 33 | 33 | 51 | Blu |
Ogni canale va da 00 (0, nessun colore) a FF (255, intensità massima). Quindi #FF5733 significa rosso al massimo, verde moderato, un po' di blu — il che dà un rosso aranciato caldo.
Come convertire HEX in RGB
- Inserisci il tuo codice HEX — digita o incolla un codice come #FF5733, o usa il selettore di colore.
- Consulta i valori RGB — vedi gli equivalenti in rosso, verde e blu (0-255 ciascuno).
- Copia in qualsiasi formato — recupera i valori in
rgb(255, 87, 51), canali individuali o altri formati come HSL.
Codici colore comuni
| Colore | HEX | RGB |
|---|---|---|
| Bianco | #FFFFFF | rgb(255, 255, 255) |
| Nero | #000000 | rgb(0, 0, 0) |
| Rosso | #FF0000 | rgb(255, 0, 0) |
| Verde | #00FF00 | rgb(0, 255, 0) |
| Blu | #0000FF | rgb(0, 0, 255) |
| Giallo | #FFFF00 | rgb(255, 255, 0) |
Consigli
- Usa HEX in CSS —
color: #FF5733è più pulito e più comune dicolor: rgb(255, 87, 51)nei fogli di stile. - Usa RGB per la trasparenza — quando servono colori semitrasparenti, usa
rgba(255, 87, 51, 0.5). Non c'è un modo di aggiungere un alpha in HEX standard (anche se l'HEX a 8 cifre esiste, il supporto del browser varia). - Scorciatoia a 3 cifre —
#F00equivale a#FF0000. Usalo quando ogni coppia ha cifre identiche per guadagnare spazio. - Il selettore di colore è più rapido — se cerchi il colore giusto, usa il selettore visivo invece di indovinare i valori HEX. Copia il codice una volta soddisfatto.
Domande frequenti
Come convertire HEX in RGB manualmente?
Dividi il codice hex in tre coppie (per es. #FF8800 diventa FF, 88, 00). Converti ogni coppia dalla base 16 alla base 10. FF = 255, 88 = 136, 00 = 0. Il risultato è rgb(255, 136, 0).
E i codici HEX a 3 cifre?
L'HEX a 3 cifre è una scorciatoia dove ogni cifra è raddoppiata. #F80 equivale a #FF8800. La maggior parte dei convertitori gestisce entrambi i formati automaticamente.
Quando usare HEX o RGB?
HEX è più compatto e più comune in CSS. RGB è preferibile quando bisogna manipolare i canali individualmente in codice o usare rgba() per la trasparenza. Entrambi rappresentano gli stessi colori.
Cosa rappresenta il simbolo # in un codice HEX?
Il cancelletto (#) è un prefisso che indica che il valore è un codice colore esadecimale. Non fa parte del valore stesso. Alcuni strumenti accettano i codici con o senza cancelletto.