Verificatore contrasto WCAG
Verifica il contrasto dei colori secondo le norme WCAG.
Testo di esempio grande
Questo è un testo di esempio normale per verificare il contrasto secondo le linee guida WCAG 2.1.
Testo piccolo per verificare la leggibilità a dimensioni ridotte.
Rapporto di contrasto
7.00:1
AA Testo normale
Supera
minimo 4.5:1
AAA Testo normale
Supera
minimo 7:1
AA Testo grande
Supera
minimo 3:1
AAA Testo grande
Supera
minimo 4.5:1
Verificatore di contrasto WCAG: assicura l'accessibilita del tuo web design
Il contrasto tra il colore del testo e il colore di sfondo e uno dei fattori piu critici per l'accessibilita web. Le Web Content Accessibility Guidelines (WCAG 2.1) definiscono rapporti minimi di contrasto per garantire che il contenuto sia leggibile per persone con problemi di vista, daltonismo o che leggono in condizioni di luce non ottimali.
Lo standard WCAG definisce due livelli di conformita. Il livello AA (raccomandato per la maggior parte dei siti) richiede un rapporto minimo di 4.5:1 per testo normale e 3:1 per testo grande (18px+ o 14px+ in grassetto). Il livello AAA (il piu alto) richiede 7:1 per testo normale e 4.5:1 per testo grande. Il nostro strumento calcola il rapporto di contrasto esatto e indica se supera ciascun livello.
Il rapporto di contrasto si calcola confrontando la luminanza relativa dei due colori usando la formula definita dalle WCAG. Il nostro strumento mostra un'anteprima visiva del testo con i colori selezionati, permettendoti di valutare la leggibilita prima di implementare le modifiche nel tuo design.
Domande frequenti
Cos'e il rapporto di contrasto WCAG?
E una misura numerica della differenza di luminosita tra due colori. Il minimo per testo normale e 4.5:1 (livello AA) e 7:1 (livello AAA). Per testo grande, i minimi sono 3:1 (AA) e 4.5:1 (AAA). Questi standard garantiscono la leggibilita per persone con problemi di vista.
Cosa significano i livelli AA e AAA?
Sono livelli di conformita WCAG. AA e il livello minimo raccomandato per la maggior parte dei siti web. AAA e il livello piu alto ed e richiesto per contenuti critici o siti governativi. AAA e piu restrittivo ma garantisce migliore accessibilita.
Come miglioro il contrasto del mio sito?
Usa colori scuri su sfondo chiaro (o viceversa). Evita combinazioni problematiche come grigio su bianco o giallo su bianco. Il nostro strumento ti permette di testare combinazioni in tempo reale e ti indica se soddisfano ciascun livello.
Vuoi saperne di più? Leggi la nostra guida completa →