Nomi Colori HTML
Tutti i 148 colori HTML/CSS con nome e codici HEX, RGB e HSL. Cerca, filtra per famiglia, ordina per tonalità e trova il colore più vicino a qualsiasi hex.
Aggiornato giugno 2026
Revisionato da Rafael Duarte
Lime vs Green
Valore puroIn CSS, lime è il verde puro #00FF00 — green è in realtà la tonalità 50% più scura #008000.
Aqua vs Cyan
IdenticiSia aqua che cyan corrispondono esattamente a #00FFFF. Sono sinonimi in ogni browser.
Gray vs Grey
SinonimiCSS accetta entrambe le grafie: 7 coppie gray/grey contribuiscono al totale di 148 keyword.
141 colori trovati
Trova il Colore con Nome Più Vicino
Incolla qualsiasi codice hex e trova il colore CSS con nome più vicino, ordinato per distanza di colore ΔE (CIELAB).
La storia di RebeccaPurple #663399
Nel 2014 la comunità del web si unì per onorare Rebecca Meyer, la figlia di sei anni del pioniere del CSS Eric Meyer, morta di tumore al cervello il giorno del suo compleanno. Su proposta della comunità, la tonalità di viola che amava fu aggiunta per sempre alla specifica CSS come rebeccapurple — l'unico colore CSS che porta il nome di una persona.
Come cercare tra i nomi dei colori HTML
Tutti i 148 colori CSS con nome, con codici HEX, RGB e HSL
1. Cerca per nome o codice hex
La griglia si filtra mentre scrivi: funziona con nomi come tomato, con la grafia grey e con frammenti di codice come ff63.
2. Filtra per famiglia e ordina
Scegli una delle dieci famiglie (Rossi, Blu, Verdi, Grigi…) e ordina per nome, tonalità, luminosità o saturazione.
3. Copia il codice o trova il più vicino
Clicca un colore per copiarne l'HEX o aprire i dettagli; incolla un tuo codice nel cercatore per sapere quale nome CSS gli somiglia di più.
Cosa trovi in questa tabella dei colori HTML
Le 148 parole chiave CSS, finalmente consultabili come un designer
Colore con nome più vicino
Incolla un codice hex (a 3 o 6 cifre) e ottieni la parola chiave CSS più simile per distanza ΔE nello spazio CIELAB, più tre alternative.
Filtro per famiglia di colore
Dieci famiglie, dai rossi ai grigi: vedi tutti i blu insieme invece di scorrere una tabella in ordine alfabetico.
Ordinamento per tonalità, luminosità o saturazione
Passa in rassegna una famiglia dal più chiaro al più scuro, o dal più saturo al più spento.
Codice CSS pronto
La scheda di ogni colore riporta HEX, RGB e HSL e un blocco CSS con le quattro scritture equivalenti, da copiare con un clic.
Immagini da condividere
Per ogni colore puoi generare un PNG quadrato da 1080×1080 o largo da 1200×630 con nome e codici, da scaricare o condividere.
I casi che confondono
Tre schede chiariscono lime e green, aqua e cyan, gray e grey, con campioni affiancati.
Esempi di ricerca
Quando usare i nomi dei colori CSS
Prototipi, didattica e scelta rapida delle tonalità
Prototipi e demo
background: cornflowerblue si scrive più in fretta di un codice hex e si legge meglio durante una revisione del codice.
Dare un nome al colore del brand
Incolla l'hex del marchio nel cercatore e scopri se esiste una parola chiave abbastanza vicina per bozze e mockup.
Scegliere una tonalità in una famiglia
Filtra i Verdi e ordinali per luminosità per confrontare seagreen, forestgreen e darkgreen uno accanto all'altro.
Lezioni e documentazione
Nomi come tomato o papayawhip restano in mente e aiutano a spiegare i colori CSS a chi inizia.
Email HTML e Markdown
Una parola chiave come crimson si incolla senza errori in un template email o in un editor senza selettore di colori.
Errori comuni con i colori CSS
Usare green per il verde puro
green è #008000, a metà luminosità. Il verde pieno #00FF00 in CSS si chiama lime.
Aspettarsi che il nome più vicino sia identico
Il cercatore indica la parola chiave più simile, non uguale: il rosso del tricolore #CE2B37 è vicino a crimson (#DC143C), ma la differenza si vede.
Contare solo 140 colori
La specifica attuale definisce 148 parole chiave: 141 nomi più 7 varianti con grey. Liste vecchie o validatori datati possono rifiutare nomi validi come rebeccapurple.
Confondere i nomi CSS con le classi Tailwind
purple in CSS e text-purple-700 in Tailwind vengono da palette diverse e hanno valori diversi: per una corrispondenza esatta confronta sempre l'hex.
Perché usare questa tabella dei colori HTML
Invece di una tabella statica in ordine alfabetico, filtri per famiglia e ordini per tonalità, luminosità o saturazione, cioè nel modo in cui si sceglie davvero un colore. Il cercatore usa la distanza ΔE nello spazio CIELAB, che segue la percezione dell'occhio meglio di un semplice confronto tra valori RGB.
Molti nomi vengono dalla palette X11 dei sistemi Unix, poi adottata da SVG e CSS: per questo convivono navajowhite, papayawhip e rebeccapurple. Le schede di alcuni colori raccontano da dove viene il nome.
lime o green?
La confusione più frequente tra i nomi CSS
Domande frequenti
Le parole chiave valide sono 148: 141 nomi distinti più 7 varianti con la grafia britannica grey. I primi 16 vengono da HTML 4.01, gli altri dalla palette X11 tramite SVG, e rebeccapurple è stato aggiunto nel 2014.
Riferimenti
L'elenco di riferimento (in inglese) dei colori con nome, con campioni e note sulla compatibilità.
La tabella ufficiale (in inglese) delle 148 parole chiave con i valori RGB esatti.
Il post (in inglese) in cui Eric Meyer racconta la nascita di rebeccapurple.
Strumenti correlati
- Verificatore Contrasto Colori Design Verificatore contrasto colori gratuito — verifica subito la conformità WCAG 2.2 AA e AAA. Anteprima live, simulazione daltonismo e suggerimenti colori...
- Convertitore di Colori Design Converti colori tra HEX, RGB, HSL e CMYK all'istante. Selettore di colori gratuito con controllo contrasto WCAG e generatore di palette.
- Generatore di Palette Colori Design Genera palette colori armoniose da qualsiasi colore base. Scegli armonia Analoga, Complementare, Triadica o Tetradica — esporta come CSS variables o JSON.
- Palette Colori da Immagine Design Estrai palette colori da qualsiasi immagine — ottieni codici HEX, RGB, HSL ed esporta come CSS variables, Tailwind, JSON o PNG. 100% nel browser, senza upload.
- Generatore CSS Box Shadow — Neumorfismo, Glassmorfismo e Tailwind Design Generatore CSS box shadow gratuito con anteprima in tempo reale. Crea ombre, effetti neumorfismo e glassmorfismo. Esporta in CSS, Tailwind o variabili CSS.
