DEV

HEX vs RGB vs HSL: Quale Formato Colore Dovresti Usare?

I CSS moderni supportano più di una dozzina di formati colore diversi — HEX, RGB, RGBA, HSL, HSLA, OKLCH, LCH, Display P3 e altri. Ogni formato ha punti di forza diversi. Il nostro convertitore traduce istantaneamente tra tutti i formati e spiega quando usare ciascuno.

Guida ai Formati Colore

  • HEX (#ff6b6b): Il più diffuso per il web. Compatto, leggibile dagli sviluppatori esperti. Non supporta nativamante la trasparenza (usa #RRGGBBAA per 8 cifre).
  • RGB (255, 107, 107): Intuitivo perché corrisponde ai canali fisici del monitor. Facile aggiungere trasparenza con rgba().
  • HSL (0°, 100%, 71%): Hue (tinta), Saturation (saturazione), Lightness (luminosità). Il formato più intuitivo per creare variazioni di un colore — basta regolare L per schiarire o scurire.
  • OKLCH: Il formato CSS moderno con interpolazione percettivamente uniforme. Ideale per palette colori coerenti e transizioni smooth.

Come Usare il Convertitore

  1. Inserisci il colore in qualsiasi formato nel campo di input.
  2. Il convertitore mostra automaticamente tutti i valori equivalenti.
  3. Clicca su qualsiasi formato per copiarlo negli appunti.
  4. Usa il selettore colore visivo per esplorare variazioni.