Sviluppo Web

Color Converter

Conversione del colore tra HEX, RGB, HSL, HSV/HSB e CMYK — inserisci un valore in un campo qualsiasi, gli altri si aggiorneranno istantaneamente.

The same color can be written differently depending on context: HEX and RGB are convenient for code, HSL is intuitive for picking a hue and lightness, and CMYK is for print. This tool converts between all of them at once.

How to use it

Which format to use when

Things to keep in mind

CMYK on screen is only an approximation — the exact printed color depends on the printer, paper, and color profile used.

Conversion between color spaces isn't always exact for extreme, highly saturated colors, due to differences in gamut coverage between models.

Articolo su questo strumento: HEX, RGB, HSL: perché esistono così tanti modi di scrivere un colore

Domande frequenti

Come gestisce il convertitore il canale alfa (trasparenza)?

L'alfa è supportato in HEX (#RRGGBBAA), RGBA e HSLA — ciò che inserisci si riporta negli altri formati che supportano la trasparenza, mentre i formati senza canale alfa, come il CMYK semplice, lo ignorano semplicemente.

Perché il valore cambia leggermente dopo la conversione in CMYK e ritorno in HEX?

CMYK è un modello orientato alla stampa senza un'unica formula fissa per la conversione da e verso RGB, quindi un andata e ritorno può spostare i valori di un errore di arrotondamento di una o due unità; visivamente il colore rimane praticamente lo stesso.

I miei dati sul colore vengono inviati da qualche parte?

No, ogni conversione avviene localmente nel tuo browser con JavaScript — nulla viene caricato su un server.

In cosa differisce OKLCH da HSL?

OKLCH descrive un colore tramite luminosità (L), croma (C) e tonalità (H), ma a differenza di HSL tiene conto di come l'occhio umano percepisce realmente la luminosità — cambiare L in OKLCH non distorce la saturazione percepita del colore, quindi le transizioni tra le tonalità risultano più uniformi.

Cosa significa che un colore è «fuori gamma» (out of gamut)?

Alcuni colori in spazi ampi come OKLCH o Display P3 non possono essere riprodotti fisicamente su display che supportano solo sRGB — il browser sostituisce allora il colore disponibile più vicino entro la gamma supportata.

Articoli: Sviluppo Web

Minificazione CSS: cosa viene davvero rimosso dal file e perché

Perché il CSS minificato funziona esattamente allo stesso modo nel browser, pur diventando illeggibile per una persona.

Minificazione JavaScript: la differenza tra minificare e offuscare

Perché il codice minificato resta leggibile se lo si desidera, mentre quello offuscato no.

Minificazione HTML: perché gli spazi nel markup contano davvero

Perché rimuovere gli spazi dentro <pre> o una textarea può rompere l'aspetto della pagina, a differenza di quasi tutti gli altri punti.

Gradienti CSS: in cosa linear differisce da radial e conic

Perché conic-gradient è adatto ai grafici a torta, mentre radial-gradient crea un effetto macchia di luce.

L'algoritmo di Luhn: come si verifica la correttezza di un numero di carta

Perché un numero di carta che supera il controllo di Luhn non significa che quella carta esista realmente.

IBAN: come è strutturato un numero di conto bancario internazionale

Perché le prime due lettere di un IBAN sono un codice paese, non parte del numero di conto vero e proprio.

Codici QR: come un link entra in un quadrato di pixel

Perché un codice QR con un logo al centro si scansiona ancora, anche se parte del disegno è coperta.

Codici a barre: in cosa Code 128 differisce da EAN-13

Perché i prodotti sugli scaffali dei negozi usano quasi sempre EAN-13 invece di Code 128.

Immagini placeholder: perché le immagini finte contano durante lo sviluppo

Perché gli sviluppatori inseriscono deliberatamente rettangoli grigi al posto di foto reali mentre un layout è ancora in costruzione.