Convertitori di colore: HEX, RGB, RGBA, HSL, HSV, alpha e accessibilità
HEX, RGB, HSL e HSV sono sistemi diversi per descrivere un colore. HEX in RGB può essere esatto nello stesso spazio, mentre RGBA in HEX richiede una decisione sulla trasparenza.
HEX e RGB spesso sono gli stessi canali
#RRGGBB codifica tre canali RGB 8 bit in esadecimale. HEX in RGB cambia la notazione.
#369 si espande in #336699; uno spazio colore diverso può però cambiare il significato dei numeri.
Alpha rappresenta opacità
RGBA aggiunge alpha e il risultato visibile dipende dallo sfondo. HEX in RGBA non può prevederlo senza background.
#RRGGBBAA conserva alpha; per RGBA in HEX controllate se l’output resta a otto cifre.
HSL è comodo ma non uniforme
HSL rende intuitivi hue, saturation e lightness. HEX in HSL aiuta con le varianti.
Uguale lightness non significa uguale luminosità percepita.
HSV è un modello diverso
HSV usa Value ed è comune nei picker. HEX in HSV collega strumenti diversi.
HSL e HSV non sono intercambiabili.
Arrotondamento
Arrotondare troppo presto può rompere un round-trip esatto. Conservate più precisione internamente.
Anche alpha viene quantizzato fra frazioni e 8 bit.
Wide gamut
CSS Color 4 supporta spazi come display-p3. Tornare a HEX sRGB può richiedere clipping.
Controllate il profilo colore nei file professionali.
Contrasto
WCAG usa luminanza relativa fra testo e sfondo, non HSL lightness.
Il colore non dovrebbe essere l’unico segnale informativo.
Design system
Conservate un valore canonico e generate le sintassi derivate. Documentate alpha e spazio.
RGB in HEX risolve la notazione, non l’accessibilità.
Workflow
Identificate lo spazio, convertite con precisione, gestite alpha e provate nel browser reale.
Per UI, concludete con un test di contrasto.
Domande frequenti
HEX è più preciso di RGB?
No.
RGBA determina il colore finale?
Non senza lo sfondo.
HSL e HSV sono uguali?
No.
Una conversione corretta garantisce accessibilità?
No; serve test del contrasto.
Standard colore e accessibilità
- W3C — CSS Color Module Level 4
- W3C Web Accessibility Initiative — Understanding Contrast Minimum
- W3C Web Accessibility Initiative — Use of Color
- U.S. Web Design System — Color
This article is an original practical guide informed by the standards and official references above.