Verifica del contrasto tra colori (WCAG 2.2)
Calcola il rapporto di contrasto tra colore del testo e dello sfondo con la formula delle WCAG 2.2 e vedi quali criteri di successo (1.4.3, 1.4.6, 1.4.11) sono soddisfatti.
Rapporto di contrasto
15,24:1
Il testo di esempio mostra la combinazione di colori.
Testo grande
| Criterio | Richiesto | Risultato |
|---|---|---|
| 1.4.3 (AA) · Testo normale | 4,5:1 | ✓ Soddisfatto |
| 1.4.3 (AA) · Testo grande | 3,0:1 | ✓ Soddisfatto |
| 1.4.6 (AAA) · Testo normale | 7,0:1 | ✓ Soddisfatto |
| 1.4.6 (AAA) · Testo grande | 4,5:1 | ✓ Soddisfatto |
| 1.4.11 (AA) · Interfaccia e grafica | 3,0:1 | ✓ Soddisfatto |
Come funziona
Per ogni colore si calcola la luminanza relativa definita nelle WCAG 2.2 per lo spazio sRGB; il rapporto di contrasto è (L1 + 0,05) / (L2 + 0,05), dove L1 è la luminanza del colore più chiaro. Va da 1:1 a 21:1.
Soglie delle WCAG 2.2: testo 4,5:1 e testo grande 3:1 per il livello AA (1.4.3); 7:1 e 4,5:1 per il livello AAA (1.4.6); 3:1 per componenti dell'interfaccia e grafica (1.4.11). Testo grande significa almeno 18 punti, o 14 punti in grassetto.
Il rapporto è mostrato troncato a due decimali, così un valore appena sotto una soglia (4,499) non appare come 4,50; il confronto usa il valore esatto. Lo strumento non considera trasparenze, sfumature, immagini di sfondo né le eccezioni dei criteri (testo decorativo, loghi).
Fonti
- Web Content Accessibility Guidelines (WCAG) 2.2: contrast ratio, relative luminance, success criteria 1.4.3, 1.4.6, 1.4.11, large scale text, World Wide Web Consortium (W3C) (consultato il 20 ottobre 2026)