Convertitore di colori
Inserisci un codice colore esadecimale per visualizzare i suoi equivalenti RGB e HSL con i valori dei singoli canali rosso, verde e blu.
Come utilizzare questo convertitore di colori
- Inserisci il codice colore esadecimale
Digita un codice esadecimale a 6 cifre nel campo del codice colore Hex (es. FF6B35 o 00FF88). Ometti il simbolo #.
- Leggi i valori RGB
I risultati dei canali Rosso, Verde e Blu mostrano i valori 0–255 per ogni componente.
- Controlla l'output HSL
Esamina il risultato HSL per tonalità (0–360°), saturazione e luminosità — utile per le regolazioni del colore.
Come funziona questo convertitore di colori
Questo strumento converte un codice colore esadecimale in rappresentazioni RGB (rosso, verde, blu) e HSL (tonalità, saturazione, luminosità). Ogni coppia esadecimale corrisponde a un valore di canale a 8 bit (0–255) e la conversione HSL utilizza la matematica standard dello spazio colore.
R = hex[0:2] → decimale; G = hex[2:4] → decimale; B = hex[4:6] → decimale Hex #FF6B35 → RGB(255, 107, 53) → HSL(16, 100%, 60%).
Hex 000000 → RGB(0, 0, 0) → HSL(0, 0%, 0%) — nero puro.
Hex FFFFFF → RGB(255, 255, 255) → HSL(0, 0%, 100%) — bianco puro. Hex 808080 → RGB(128, 128, 128) → HSL(0, 0%, 50%) — grigio medio.
- ✓ L'input è un codice colore esadecimale a 6 cifre valido.
- ✓ Il canale alfa non è supportato in questa versione.
- La conversione CMYK richiede un profilo colore e non è inclusa qui.
Comprendere i modelli di colore
HEX, RGB e HSL sono modi diversi per descrivere lo stesso colore. HEX codifica l'RGB come una stringa esadecimale a 6 cifre: ogni coppia di caratteri è un canale a 8 bit (0–255). L'RGB esprime gli stessi valori come tre numeri, i colori primari additivi emessi dagli schermi. L'HSL (Hue, Saturation, Lightness) è un modello cilindrico: la tonalità è l'angolo sulla ruota dei colori (0° rosso, 120° verde, 240° blu), la saturazione è l'intensità del colore e la luminosità è la brillantezza. I designer spesso preferiscono l'HSL quando regolano i colori a livello di codice: cambiare solo la luminosità scurisce o schiarisce senza spostare la tonalità, mentre modificare la saturazione regola la vividezza.
Casi d'uso per gli sviluppatori nella conversione del colore
Gli sviluppatori convertono i colori durante la creazione di sistemi di design, l'implementazione di temi, la generazione di tavolozze di colori e il debug dei CSS. I design token spesso memorizzano i colori in formato esadecimale; la conversione in RGB o HSL consente calcoli in tempo reale come sovrapposizioni di opacità o controlli di contrasto per l'accessibilità. I selettori di temi potrebbero dover derivare varianti più chiare o più scure da un colore di base utilizzando l'HSL. Gli strumenti di accessibilità automatizzati convertono i colori per calcolare i rapporti di luminanza e contrasto. Durante il debug di bug di layout o di temi, visualizzare un valore esadecimale come RGB o HSL aiuta a identificare quale canale è errato. La conversione del colore viene utilizzata anche nella visualizzazione dei dati, nelle librerie di grafici e nei temi dinamici dell'interfaccia utente.
Domande frequenti
Posso inserire un codice hex a 3 cifre?
Attualmente questo strumento richiede un codice a 6 cifre. Per le abbreviazioni a 3 cifre come F60, espandile prima in FF6600.
Cos'è l'HSL?
HSL sta per Hue (Tonalità), Saturation (Saturazione), Lightness (Luminosità). È un modo alternativo per descrivere i colori che alcuni designer trovano più intuitivo rispetto all'RGB.