Convertitore HEX in RGB
Digiti o incolli un colore in HEX, RGB, HSL o CMYK: gli altri formati si aggiornano mentre scrive. Copi i valori CSS pronti, sfogli le varianti più chiare e più scure e verifichi il contrasto con il testo.
Le serve un’interfaccia bella da vedere e facile da leggere?
Progettiamo e sviluppiamo siti e app con un sistema di colori coerente: palette del brand, contrasto accessibile, design token condivisi da designer e sviluppatori. Ci racconti il Suo progetto e riceva una stima.
Grazie! Ti risponderemo entro un giorno lavorativo.
In breve: inserisca un colore in qualsiasi campo, per esempio #2e5cf2, rgb(46, 92, 242), hsl(226, 88%, 56%) o cmyk(81%, 62%, 0%, 5%), e il convertitore compila subito gli altri formati. Sotto trova i valori CSS, OKLCH compreso, le varianti più chiare e più scure e la verifica del contrasto WCAG 2.2.
Come convertire HEX in RGB
- Inserisca il colore. Incolli un codice HEX con o senza «#»: sono accettate 3, 4, 6 o 8 cifre. Può anche partire da RGB, HSL, CMYK o dal selettore colore.
- Legga il risultato. Tutti e quattro i campi si aggiornano mentre scrive. Un valore non valido viene evidenziato e gli altri campi mantengono l’ultimo colore valido.
- Copi ciò che Le serve. Ogni campo e ogni valore CSS ha un pulsante di copia. L’indirizzo della pagina include il colore, quindi può condividere il link.
- Verifichi la leggibilità. Lo strumento di contrasto usa il colore corrente come sfondo. Imposti il colore del testo e veda se la coppia supera AA e AAA.
Come funziona la conversione
Un codice HEX è lo stesso colore RGB scritto in base 16: ogni coppia di cifre è un canale da 00 a FF, cioè da 0 a 255. #2E5CF2 significa rosso 0x2E = 46, verde 0x5C = 92, blu 0xF2 = 242. Un codice corto come #3AF raddoppia ogni cifra e diventa #33AAFF. La settima e l’ottava cifra aggiungono il canale alfa: #2E5CF280 è lo stesso blu con opacità del 50%.
| Formato | Esempio | Dove si usa |
|---|---|---|
| HEX | #2E5CF2 | CSS, Figma, linee guida del brand |
| RGB | rgb(46, 92, 242) | CSS, codice Android e iOS, editor di immagini |
| HSL | hsl(226, 88%, 56%) | Temi CSS: cambiare la luminosità mantenendo la tinta |
| OKLCH | oklch(54.2% 0.23 265.7) | Scale di colori CSS moderne con luminosità percepita uniforme |
| CMYK | cmyk(81%, 62%, 0%, 5%) | Riferimento indicativo per la stampa |
HSL descrive lo stesso colore come tinta (0–360°), saturazione e luminosità, utile per creare versioni più chiare e più scure di un colore del brand. OKLCH fa lo stesso in uno spazio colore percettivo, quindi passi di uguale luminosità appaiono uguali all’occhio. È supportato da tutti i browser attuali.
Una nota sul CMYK
Il convertitore usa la formula standard indipendente dal dispositivo: K = 1 − max(R, G, B), poi C, M e Y dai canali rimanenti. Le tipografie lavorano con profili ICC per carta e inchiostri specifici, quindi i loro valori possono differire di qualche punto percentuale. Usi il valore CMYK come punto di partenza e chieda alla tipografia quello definitivo.
Contrasto e accessibilità
Le WCAG 2.2 richiedono un rapporto di contrasto di almeno 4,5:1 per il testo normale, 3:1 per il testo grande e per elementi dell’interfaccia come icone e bordi dei campi. Molti blu e verdi di brand sono proprio al limite con il testo bianco. Per ottenere una palette completa da una foto o da un logo, usi il generatore di palette colori. Se il Suo prodotto ha bisogno di un sistema di colori coerente, scopra i nostri servizi di web design e sviluppo.
Domande frequenti
Come si converte HEX in RGB?
Divida il codice di sei cifre in tre coppie e converta ciascuna da esadecimale a decimale. Per #2E5CF2: 2E = 46, 5C = 92 e F2 = 242, quindi il colore è rgb(46, 92, 242). Il convertitore in questa pagina lo fa all’istante mentre scrive.
Come si converte RGB in HEX?
Converta ogni canale da 0–255 in un numero esadecimale di due cifre e le unisca dopo «#». Per rgb(255, 165, 0) si ottiene FF, A5 e 00, quindi il codice HEX è #FFA500. Inserisca il valore nel campo RGB e copi il codice HEX.
Che cos’è un codice HEX a 8 cifre?
Le ultime due cifre sono il canale alfa, da 00 (completamente trasparente) a FF (completamente opaco). #2E5CF280 è il colore #2E5CF2 con circa il 50% di opacità. Tutti i browser moderni supportano HEX a 8 e a 4 cifre in CSS.
Per il CSS è meglio HSL o RGB?
Descrivono gli stessi colori. HSL è più facile da leggere e modificare a mano: per schiarire un colore basta cambiare la luminosità. Per scale di colori e temi OKLCH è ancora migliore, perché passi uguali appaiono uguali all’occhio.
Perché i miei valori CMYK sono diversi da quelli della tipografia?
Questa pagina usa la formula standard senza profilo colore. Le tipografie convertono con profili ICC per la loro carta e i loro inchiostri, e alcuni colori dello schermo, soprattutto blu e verdi brillanti, non si possono stampare esattamente. Consideri il valore CMYK come riferimento.
Posso condividere un colore con un link?
Sì. Quando cambia il colore, l’indirizzo della pagina riceve il codice HEX dopo «#», per esempio /it/products/hex-to-rgb#2e5cf2. Chi apre il link vede lo stesso colore.
Come verifico se un testo su questo colore è leggibile?
Usi lo strumento di contrasto sotto il convertitore. Il colore corrente è impostato come sfondo; scelga il colore del testo e veda il rapporto e se supera WCAG AA (4,5:1) e AAA (7:1).