Verificatore di Contrasto Colori
Ma la volpe, col suo balzo, ha raggiunto il quieto Fido
Ma la volpe, col suo balzo, ha raggiunto il quieto Fido
Cos'è Verificatore di Contrasto Colori
Questo strumento misura il rapporto di contrasto tra un colore di testo e un colore di sfondo, confrontandolo con le linee guida di accessibilità WCAG 2.1. Mostra un'anteprima dal vivo dei due colori insieme e indica se la coppia supera AA o AAA per testo normale e testo grande, così puoi individuare problemi di leggibilità prima che arrivino in produzione.
Come usare
- Scegli o digita il colore del testo nel primo campo, come codice HEX.
- Scegli o digita il colore di sfondo nel secondo campo.
- Controlla il rapporto di contrasto e i badge di superato/non superato per AA e AAA.
- Clicca sul pulsante di scambio per testare i colori invertiti.
- Copia l'URL per condividere la coppia esatta con il tuo team.
Quando usarlo
Stai scegliendo il colore del testo per un nuovo layout e non sei sicuro sia abbastanza leggibile? Inserisci il colore del testo e dello sfondo, ad esempio #767676 su #FFFFFF, e ottieni un rapporto di 4.54:1: superato per AA su testo normale, non superato per AAA. Questa è la differenza tra un prodotto accessibile e un rilievo in un audit, che tu stia revisionando il sito di un cliente o lanciando la tua app.
Domande frequenti
Qual è un buon rapporto di contrasto per il testo?
WCAG AA richiede almeno 4.5:1 per il testo normale e 3:1 per il testo grande (18pt o 14pt grassetto e oltre). WCAG AAA è più rigoroso: 7:1 per il testo normale e 4.5:1 per il testo grande.
Qual è il rapporto di contrasto massimo possibile?
21:1, il rapporto tra nero puro (#000000) e bianco puro (#FFFFFF). Nessuna coppia di colori lo supera.
Perché i miei colori non hanno superato AA anche se il design mi sembra a posto?
Il rapporto di contrasto riguarda l'accessibilità, non la preferenza personale. Chi ha una vista ridotta, o chiunque guardi uno schermo sotto la luce intensa, ha bisogno di un contrasto maggiore rispetto a una coppia che sembra accettabile per una vista tipica.
Questo strumento controlla anche il daltonismo?
No. Lo strumento controlla il contrasto di luminanza secondo la formula WCAG, il che avvantaggia tutti gli utenti, incluse molte forme di daltonismo, ma non simula deficienze specifiche della visione dei colori.
Posso condividere questo strumento con i miei dati precompilati?
Sì. L'URL si aggiorna automaticamente mentre scegli i colori. Copia il link dalla barra degli indirizzi o usa il pulsante Condividi, chiunque lo apra vedrà i tuoi colori esatti già inseriti.
Strumenti correlati
Calcolatore di Rapporto d'Aspetto
Calcola il rapporto d'aspetto, trova la larghezza o l'altezza mancante e ridimensiona immagini e video mantenendo le proporzioni. Gratis.
Decodificatore Base64
Decodifica stringhe Base64 in testo semplice istantaneamente. Supporta output Unicode completo con emoji. Decodificatore Base64 gratuito.
Codificatore Base64
Codifica testo in Base64 istantaneamente nel browser. Supporta Unicode, emoji e caratteri speciali. Codificatore Base64 gratuito.