Convertitore di colori

Converti un colore tra HEX, RGB, HSL, HSV e CMYK con sincronizzazione bidirezionale in tempo reale, nel tuo browser.

Come si usa

  1. Scegli un colore con il selettore nativo, oppure incolla un valore che hai già: #fff, rgb(255 0 0) e hsl(210, 100%, 50%) vengono tutti riconosciuti.
  2. Tutti gli altri formati si aggiornano all'istante: HEX, RGB, HSL, HSV e CMYK restano sincronizzati in entrambe le direzioni, e il campione grande mostra l'anteprima del risultato.
  3. Fai clic su "Copia" accanto al formato che ti serve. Tutto gira nel tuo browser: nessun colore viene mai caricato.

Informazioni su questo strumento

Ogni colore su uno schermo è la stessa cosa fisica — una quantità di luce rossa, verde e blu — ma designer, sviluppatori e tipografi lo descrivono in lingue diverse. L'HEX è compatto e universale nel CSS; l'RGB è il dato grezzo dei canali; HSL e HSV descrivono un colore come lo pensa una persona, cioè una tonalità più quanto è vivida e quanto è luminosa; il CMYK descrive i quattro inchiostri che una macchina da stampa deposita sulla carta. Questo convertitore tiene un colore in memoria e lo mostra contemporaneamente in tutte e cinque le lingue.

Internamente ogni valore inserito viene prima normalizzato in RGB. Il parsing dell'HEX espande la forma abbreviata a tre cifre (#fff diventa #ffffff) e ignora una coppia alpha se la incolli. HSL e HSV usano il modello standard del croma: il croma nasce dalla saturazione combinata con la luminosità o il valore, una componente secondaria deriva dalla posizione della tonalità all'interno del suo settore di 60° e un offset costante porta il risultato alla luminosità corretta. Il CMYK usa la classica conversione da schermo, in cui il nero è uno meno il canale più alto e ogni inchiostro è la distanza restante fino a quel nero. Il parser è volutamente tollerante: virgole, spazi, barre e simboli di percentuale sono tutti facoltativi, quindi rgb(255 0 0), 255,0,0 e #f00 portano esattamente allo stesso colore.

Usi tipici: trasformare l'HEX di un brand nell'HSL che una variabile CSS si aspetta, leggere l'RGB che chiede uno strumento di design, oppure ottenere un CMYK approssimativo da passare a una tipografia. Su quest'ultimo punto serve un avvertimento. Il CMYK su schermo è sempre un'approssimazione: la stampa reale dipende dal profilo ICC della macchina, dal set di inchiostri e dalla carta, e i colori vividi dello schermo — soprattutto i blu e i verdi brillanti — non hanno un equivalente esatto in inchiostro. Considera il CMYK qui come un punto di partenza, non come una prova di stampa. Niente di ciò che scrivi viene caricato: l'intera conversione gira in JavaScript sul tuo dispositivo.

La formula

L'HEX è la notazione esadecimale dei tre byte RGB. HSL → RGB: croma C = (1 − |2L − 1|) × S, secondario X = C × (1 − |(H/60) mod 2 − 1|), offset m = L − C/2; la terna (C, X, 0) viene ruotata secondo il settore di tonalità di 60° e m viene sommato a tutti e tre i canali. HSV → RGB usa C = V × S e m = V − C. RGB → CMYK: K = 1 − max(R, G, B) e ogni inchiostro = (1 − canale − K) / (1 − K).

Domande frequenti

Quali formati di colore posso incollare?

HEX con o senza il # (#fff, #ffffff, 3498db), rgb() e rgba(), hsl() e hsla(), hsv() o hsb(), cmyk() e una trentina di nomi di colore CSS comuni come red, teal o crimson. I separatori sono flessibili: virgole, spazi e barre funzionano tutti.

Il valore CMYK è preciso per la stampa?

No, consideralo un'approssimazione. La conversione qui è la formula standard da schermo e ignora i profili colore, mentre una macchina da stampa reale usa un profilo ICC che dipende dall'inchiostro, dalla carta e dalla macchina stessa. Chiedi alla tua tipografia quale profilo usa prima di fissare un valore.

Qual è la differenza tra HSL e HSV?

Entrambi partono dallo stesso angolo di tonalità ma descrivono la luminosità in modo diverso. In HSL, il 50% di lightness è il colore puro e il 100% è sempre bianco; in HSV, il 100% di value è il colore puro e arrivi al bianco solo abbassando la saturazione. Gli strumenti di design tendono a esporre l'HSV, mentre il CSS usa l'HSL.

Lo strumento gestisce la trasparenza?

Legge il canale alpha e lo scarta. Se incolli un HEX a 8 cifre o un valore rgba(), viene convertito solo il colore opaco: la trasparenza non viene riportata negli altri formati.

I miei colori escono dal browser?

No. Ogni conversione gira in JavaScript sul tuo dispositivo. Niente viene inviato a un server, registrato o salvato.

Strumenti correlati

Link lunghi? Accorciali gratis

Vai.la trasforma qualsiasi URL in un link breve con statistiche dei clic, QR Code e il tuo biolink personale.

Vai.la non è responsabile dell'uso degli strumenti né delle decisioni prese in base ai loro risultati.