Controllo Contrasto Colore
Inserisci un colore di primo piano e uno di sfondo per controllare il rapporto di contrasto WCAG con badge AA e AAA per testo normale e grande.
21.00:1
AA
Testo normale
AA
Testo grande
AAA
Testo normale
AAA
Testo grande
Anteprima
Ma la volpe, col suo balzo, ha raggiunto il quieto Fido.
Ma la volpe, col suo balzo, ha raggiunto il quieto Fido.
Come funziona
Questo strumento calcola il rapporto di contrasto tra due colori secondo le linee guida WCAG 2.1, e indica se la tua combinazione di colori è accessibile.
Come usarlo:
- Inserisci il colore del testo e il colore di sfondo in esadecimale, RGB o usando il selettore colori.
- Lo strumento mostra istantaneamente il rapporto di contrasto.
- Verifica se il risultato soddisfa i livelli AA (4,5:1 per testo normale) o AAA (7:1).
Esempio: Testo nero (#000000) su sfondo bianco (#FFFFFF) → rapporto di contrasto 21:1 (AAA).
Limitazioni: Lo strumento valuta solo il contrasto testo/sfondo. Non copre tutti i criteri di accessibilità WCAG.
Privacy: Nessun dato viene trasmesso — tutto viene calcolato localmente.
Casi d'uso
- Controllare una palette di colori aziendali per la conformità all'accessibilità prima del lancio di un redesign
- Scegliere colori di pulsanti e link leggibili su tema chiaro o scuro
- Rispettare i requisiti WCAG 2.1 AA o AAA per conformità Section 508, EN 301 549 o ADA
- Revisionare un mockup inviato da un designer per segnalare testo illeggibile prima dello sviluppo
- Insegnare concetti di accessibilità mostrando come piccole differenze di luminanza causino grandi fallimenti di contrasto
Domande frequenti
- Cos'è il rapporto di contrasto WCAG?
- È un rapporto calcolato in base alla luminanza relativa dei due colori, da 1:1 (nessun contrasto) a 21:1 (contrasto massimo).
- Qual è il valore minimo per l'accessibilità?
- 4,5:1 per testo normale (livello AA) e 3:1 per testo grande.
- Cosa significa il livello AAA?
- Un rapporto di 7:1, raccomandato per la massima accessibilità.
- Posso testare più combinazioni?
- Sì, modifica i colori e il risultato si aggiorna in tempo reale.
- Lo strumento supporta il formato HSL?
- L'input accetta i formati esadecimale e RGB.