
Il Color Contrast Checker di WebAIM verifica se il contrasto tra testo e sfondo rispetta le WCAG. Si possono inserire colori in formato esadecimale RGB o selezionarli con il color picker, regolare la trasparenza del colore in primo piano con il valore Alpha e modificare la luminosità con lo slider.
Lo strumento calcola il rapporto di contrasto e lo confronta con i criteri WCAG. Il livello AA richiede almeno 4,5:1 per il testo normale e 3:1 per il testo grande, mentre il livello AAA richiede 7:1 per il testo normale e 4,5:1 per il testo grande. Le WCAG 2.1 richiedono inoltre un rapporto di 3:1 per elementi grafici e componenti dell’interfaccia, come i bordi dei campi dei moduli. Il testo è considerato grande quando è almeno 14 pt in grassetto (circa 18,66 px) oppure 18 pt (circa 24 px) o più.
Tra le funzioni utili, il color picker include un contagocce per prelevare i colori direttamente dallo schermo, mentre lo strumento WAVE può analizzare automaticamente il contrasto di tutti i testi presenti in una pagina. È disponibile anche un verificatore specifico per il contrasto dei link, utile quando i collegamenti sono distinti solo dal colore.