Verificatore Contrasto Colori
Verifica i rapporti di contrasto dei colori secondo le linee guida di accessibilità WCAG 2.1. Testa la conformità AA e AAA per testo normale e grande.
Parametri
Colore del testo o elemento.
Colore di sfondo da testare.
Risultati
Il rapporto di contrasto tra i due colori
Altri risultati (6)
Il testo normale (sotto i 18 pt o 14 pt in grassetto) soddisfa i requisiti WCAG AA
Il testo di grandi dimensioni (18pt+ o 14pt+ grassetto) soddisfa i requisiti WCAG AA
Il testo normale soddisfa i requisiti WCAG AAA più severi
Il testo di grandi dimensioni soddisfa i requisiti WCAG AAA più severi
Relative luminance of #000000
Relative luminance of #FFFFFF
Perché scegliere Verificatore Contrasto Colori
Il controllo del contrasto del colore verifica il rapporto di contrasto tra il colore di primo piano e quello di sfondo rispetto alle linee guida WCAG 2.1. Scopri immediatamente se la tua combinazione di colori supera la conformità AA e AAA sia per il testo normale che per quello di grandi dimensioni.
- ✓Calcola il rapporto di contrasto utilizzando la formula di luminanza relativa WCAG 2.1
- ✓Verifica tutti e quattro i livelli di conformità WCAG: AA/AAA per testo normale e di grandi dimensioni
- ✓Mostra i valori di luminanza relativi per entrambi i colori
- ✓Utilizza gli input del selettore colore per una facile selezione del colore
Come usare
- 1Scegli il colore di primo piano (testo) utilizzando il selettore colori
- 2Scegli il colore dello sfondo utilizzando il selettore colori
- 3Visualizza immediatamente il rapporto di contrasto visualizzato
- 4Controlla i risultati superato/fallito WCAG AA e AAA per il testo normale e di grandi dimensioni
- 5Regola i colori finché la tua combinazione non supera il livello richiesto
Domande frequenti (FAQ)
Qual è un buon rapporto di contrasto per l'accessibilità web?
Le WCAG 2.1 richiedono un rapporto di contrasto minimo di 4,5:1 per il testo normale (livello AA) e 3:1 per il testo di grandi dimensioni. Per la conformità AAA, il testo normale necessita di 7:1 e il testo di grandi dimensioni necessita di 4,5:1. Nero su bianco (21:1) è il massimo contrasto possibile.
Cosa conta come "testo grande" nelle WCAG?
WCAG definisce il testo di grandi dimensioni come almeno 18 pt (24 px) o 14 pt (18,66 px) in grassetto. Il testo di grandi dimensioni richiede un contrasto inferiore perché è più facile da leggere con rapporti di contrasto inferiori.
Come viene calcolato il rapporto di contrasto?
The contrast ratio uses relative luminance values: (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color luminance and L2 is the darker. Luminance is calculated using the WCAG formula: L = 0.2126 × R + 0.7152 × G + 0.0722 × B, with each channel linearized from sRGB.
Questo strumento verifica l'accessibilità al daltonismo?
Questo strumento controlla il contrasto basato sulla luminanza a vantaggio di tutti gli utenti, compresi quelli con carenze nella visione dei colori. Tuttavia, non simula tipi specifici di daltonismo. Per i test daltonici, utilizzare un simulatore di daltonismo dedicato.
Qual è il rapporto di contrasto minimo richiesto dalla legge?
Molte normative sull'accessibilità (ADA, Sezione 508, EN 301 549) fanno riferimento alle WCAG 2.1 Livello AA come standard, che richiede 4,5:1 per il testo normale. In molti paesi i siti web governativi e didattici sono tenuti per legge a soddisfare questo livello.
Riferimenti e fonti autorevoli
WCAG 2.1 Understanding Contrast (Minimum)
Vedi fonteRelative Luminance - WCAG Definition
Vedi fonteWebAIM Contrast Checker
Vedi fonteStrumenti correlati
Esplora altri strumenti pratici per questo scenario d'uso.