Binatomy
Contrast Checker

WCAG Contrast Checker

Verifica il contrasto tra colori e controlla la conformità agli standard WCAG AA e AAA

Testo normale (16px)

Testo Grande (24px Bold)

The quick brown fox jumps over the lazy dog

Rapporto di contrasto

17.06:1

Eccellente

Conformità WCAG

AA: Testo normale (≥4.5:1)PASS
AAA: Testo normale (≥7:1)PASS
AA: Testo grande (≥3:1)PASS
AAA: Testo grande (≥4.5:1)PASS
AA: Componenti UI (≥3:1)PASS
FAQ

Domande Frequenti

Tutto quello che devi sapere sull'accessibilità e il contrasto WCAG

Domande frequenti

Qual è il rapporto di contrasto minimo richiesto dalle WCAG?

Il livello AA chiede 4.5:1 per il testo normale e 3:1 per il testo grande e i componenti dell'interfaccia. Il livello AAA sale a 7:1 per il testo normale e 4.5:1 per il testo grande.

Come si calcola il rapporto di contrasto tra due colori?

Il rapporto di contrasto si ricava dalla luminanza relativa dei due colori: luminanza più chiara più 0.05, diviso luminanza più scura più 0.05. I valori vanno da 1:1 a 21:1, cioè nero su bianco.

Quando un testo è considerato grande dalle WCAG?

Le WCAG considerano grande il testo da 18pt in su, oppure da 14pt se in grassetto. Al testo grande basta un rapporto di 3:1 per il livello AA, contro il 4.5:1 richiesto al testo normale.