Nomi Colori CSS Online
Elenco completo dei 148 colori CSS con nome, codice esadecimale, RGB e HSL. Ricerca istantanea, nessun server.
Showing 148 colors
Cosa puoi fare
Trova qualsiasi colore CSS in un secondo
Dati completi
148 colori CSS con nome, hex, RGB e HSL. Tutti i formati pronti per il copia-incolla.
Compatibilità totale
Tutti i colori supportati da CSS Color Level 4 e da ogni browser moderno.
Nessun server
La ricerca avviene interamente nel browser. Nessun dato viene trasmesso a server esterni.
Ricerca istantanea
Filtraggio in tempo reale: trova il colore che cerchi prima ancora di finire di digitare.
Come funziona
Tre passaggi, senza complicazioni
Cerca un colore per nome
Digita il nome del colore in italiano o inglese (es. rosso, red, blu, navy). La ricerca è istantanea e filtra in tempo reale tutti i 148 colori CSS nominati.
Consulta i valori del colore
Per ogni colore trovi il nome CSS ufficiale, il codice esadecimale, i valori RGB e HSL. Tutti pronti per essere copiati nel tuo codice.
Copia il formato che ti serve
Clicca sul valore per copiarlo negli appunti. Usa il nome CSS per leggibilità, l'hex per compatibilità universale, o RGB e HSL per calcoli dinamici nel codice.
FAQ
Hai delle domande?
La specifica CSS Color Level 4 del W3C definisce 148 colori con nome. Questa lista include i 16 colori base di HTML 4.01 (black, white, red, green, blue, yellow, cyan, magenta e simili), i colori estesi del sistema X11 (un insieme di nomi standardizzati dai sistemi Unix/X Window System dagli anni 1980, incorporati in CSS 2.1 nel 2004), e un colore speciale: transparent, che equivale a rgba(0,0,0,0). Un caso particolare è rebeccapurple (hex 663399), aggiunto nel 2014 in memoria di Rebecca Meyer, figlia di Eric Meyer, esperto CSS di riferimento del settore.
I nomi CSS sono alias leggibili per valori numerici precisi. Ad esempio, red equivale a rgb(255,0,0) e hex FF0000. I nomi sono case-insensitive in CSS: Red, RED e red sono equivalenti. Per il codice, usare nomi come red o transparent migliora la leggibilità; per i brand color o tinte precise è necessario usare il codice hex o RGB perché i nomi coprono solo 148 valori su oltre 16 milioni possibili. Alcuni nomi hanno alias storici: gray e grey sono sinonimi (entrambi validi), così come aqua e cyan, o fuchsia e magenta.
HSL (Hue, Saturation, Lightness) è una rappresentazione cilindrica dello spazio colore, dove H è la tonalità in gradi (0-360, dove 0 e 360 sono il rosso, 120 è il verde, 240 è il blu), S è la saturazione in percentuale (0% = grigio, 100% = colore puro) e L è la luminosità (0% = nero, 50% = colore puro, 100% = bianco). HSL è utile quando si generano varianti di un colore nel codice: per schiarire un bottone al passaggio del mouse si incrementa L di 10-15%, per creare tinte di una palette si variega S mantenendo H costante. In CSS moderno, la funzione hsl() è supportata da tutti i browser dal 2010; la variante hsla() aggiunge il canale alfa per la trasparenza.
La maggior parte dei nomi di colore CSS deriva dal sistema X11, sviluppato al MIT e distribuito da fine anni 1980. I nomi X11 furono creati empiricamente da programmatori che assegnavano nomi descrittivi o evocativi ai colori disponibili nei monitor dell'epoca. Questo spiega nomi come cornsilk (seta di mais, un bianco caldo), bisque (bianchetta, un rosa pallido usato in ceramica), moccasin, linen (lino), e gainsboro (da John Gainsborough, pittore inglese). Alcuni nomi riflettono colori standard industriali come steelblue, forestgreen o slategray.
I nomi CSS sono utilizzabili ovunque si aspetti un valore di colore: proprietà color e background-color in CSS, attributi fill e stroke in SVG, e funzioni di colore in JavaScript tramite canvas o CSS custom properties. Esempi: body { background-color: cornsilk; } oppure svg circle { fill: steelblue; stroke: navy; }. Per colori con trasparenza, si usa rgba() o la funzione color() di CSS Color Level 4. I nomi sono supportati in tutti i browser moderni senza eccezioni; il colore rebeccapurple fu standardizzato in CSS Color Level 4 ed è supportato da Chrome 38, Firefox 33, Safari 9 e Edge 12.
Le linee guida WCAG 2.1 (Web Content Accessibility Guidelines) richiedono un rapporto di contrasto minimo di 4,5:1 tra testo e sfondo per soddisfare il livello AA (il livello minimo raccomandato), e di 7:1 per il livello AAA. Il rapporto di contrasto si calcola confrontando la luminanza relativa (L) dei due colori, definita come L = 0.2126R + 0.7152G + 0.0722B dove i valori RGB sono linearizzati. Ad esempio, black su white ha un contrasto di 21:1 (massimo possibile). Navy su white ha circa 13,9:1. Red su white ha circa 4:1, appena sotto il minimo AA, il che significa che il testo rosso su sfondo bianco non è accessibile per WCAG 2.1 AA.
Colori CSS con nome: guida completa a hex, RGB, HSL e accessibilità
La specifica CSS Color Level 4 del W3C (World Wide Web Consortium) definisce 148 nomi di colore standardizzati, ciascuno mappato a un preciso valore RGB. Questi nomi hanno una storia che precede il web: la maggior parte deriva dal sistema X11 (X Window System), sviluppato al MIT Athena Project a partire dal 1984 e distribuito come componente grafico dei sistemi Unix e derivati. La lista dei colori X11, inclusa nel file rgb.txt distribuito con ogni installazione X11, fu progressivamente standardizzata e incorporata nelle specifiche CSS a partire da CSS 2.1 (2004). La lista include 16 colori HTML 4.01 originali, circa 130 colori X11 con nomi descrittivi o evocativi, e il colore transparent (rgba(0,0,0,0)). Il colore rebeccapurple (hex 663399) è l'unico colore aggiunto in tempi recenti, nel 2014, su proposta della comunità web in memoria di Rebecca Alison Meyer.
I tre spazi colore principali usati in CSS per i colori nominati sono RGB, HSL e hex. RGB (Red, Green, Blue) è un sistema additivo: i tre canali, ciascuno con valori da 0 a 255, si sommano per produrre il colore finale. Hex è la rappresentazione esadecimale di RGB: #RRGGBB dove ogni coppia di cifre hex (00-FF) corrisponde a un canale (0-255). HSL (Hue, Saturation, Lightness) è una proiezione cilindrica del cubo RGB: la tonalità H va da 0 a 360 gradi seguendo lo spettro visibile, la saturazione S da 0 a 100% (grigio a colore puro) e la luminosità L da 0 a 100% (nero, colore puro a L=50%, bianco). HSL è particolarmente utile per generare varianti programmatiche: incrementare L di 10 schiarisce il colore, decrementarlo lo scurisce, ridurre S lo desatura verso il grigio.
Dal punto di vista dell'accessibilità web, la scelta dei colori CSS ha implicazioni dirette sulla conformità WCAG. Le linee guida WCAG 2.1 (Success Criterion 1.4.3 per il livello AA) richiedono un rapporto di contrasto minimo di 4,5:1 per il testo normale e di 3:1 per il testo grande (18pt o 14pt grassetto). Il rapporto di contrasto è calcolato come (L1 + 0.05) / (L2 + 0.05), dove L1 è la luminanza relativa del colore più chiaro e L2 quella del colore più scuro. La luminanza relativa è definita dalla formula L = 0.2126 * R_lin + 0.7152 * G_lin + 0.0722 * B_lin, dove i valori linearizzati si ottengono applicando la curva gamma inversa sRGB (C/12.92 per C <= 0.04045, ((C+0.055)/1.055)^2.4 altrimenti). In pratica, combinazioni come navy su white (contrasto ~14:1) o darkgreen su white (~8:1) sono conformi WCAG AA, mentre lightblue su white (~1,3:1) non lo è.