Vai al contenuto
helpyself

Correttore di contrasto

Local only — nothing is uploaded unless you save or share it.

Un correttore di contrasto dei colori — il colore accessibile più vicino che supera il livello AA delle WCAG.

  1. Inserisci il colore del testo e il colore di sfondo che non passano.
  2. Scegli il livello WCAG che ti serve — AA è l'obiettivo abituale per il testo corrente.
  3. Decidi quale colore può cambiare, oppure lascia muovere quello più vicino.
  4. Copia il colore suggerito, o prendi un'altra opzione dall'elenco.
Salva questo strumento

Tieni Correttore di contrasto a portata di mano

Aggiungi ai preferiti

Su questo strumento

Sapere che una coppia di colori non passa è solo metà della risposta. Questo è il correttore di contrasto per l'altra metà: dagli una coppia bocciata e ti restituisce il colore accessibile più vicino che passa. Un verificatore di contrasto ti dice che 3,1:1 non basta e ti lascia a indovinare sfumature finché qualcosa regge — ed è così che i colori del marchio diventano in silenzio il primo che è passato. Questo trova il colore più vicino che funziona. Sposta la luminosità e nient'altro, quindi tonalità e saturazione sopravvivono: il risultato è riconoscibilmente il colore che hai scelto, un po' più chiaro o più scuro, e non un colore diverso che per caso supera l'asticella. E guarda ogni luminosità ammessa invece di fermarsi al primo successo, così un colore a cui basta un cambiamento del 3 % riceve un cambiamento del 3 %. Sei tu a scegliere quale colore può muoversi. Le palette di marca di solito ne fissano uno dei due — lo sfondo è la pagina, oppure il colore del testo è il logo — e un suggerimento che cambia quello sbagliato non serve a nulla. Chiedi una correzione al testo, allo sfondo, o a quello più vicino. Ci sono tutti e quattro i gradi WCAG: AA a 4,5:1 per il testo corrente, AA Grande a 3:1 per i titoli da 18pt o 14pt in grassetto, e i più severi livelli AAA a 7:1 e 4,5:1. Tutto funziona nel tuo browser.

Domande frequenti

Perché cambia solo la luminosità?

Perché il contrasto è funzione della luminanza relativa, e fra tonalità, saturazione e luminosità solo la luminosità sposta la luminanza in modo significativo. Cambiare la tonalità produrrebbe un colore che passa e che non è il tuo. Tenere tonalità e saturazione significa che la correzione somiglia ancora al colore che hai scelto.

Qual è il colore più vicino che passa?

Quello la cui luminosità si è mossa di meno. Vengono provati tutti i valori da 0 a 100 e vince il cambiamento più piccolo che supera il tuo livello, quindi non ti viene mai chiesto di scurire più del necessario.

E se non passa niente?

Lo dice. Su uno sfondo grigio medio, l'AAA a 7:1 è irraggiungibile perfino con il nero puro o il bianco puro: nessuna sfumatura di nessun colore ce la fa. La risposta onesta è allora cambiare l'altro colore, ed è a questo che serve l'opzione di regolazione.

A quale livello WCAG dovrei puntare?

L'AA a 4,5:1 per il normale testo corrente è il requisito di legge quasi ovunque, compresa la direttiva europea sull'accessibilità. L'AAA a 7:1 vale la pena per la lettura lunga. Il testo grande — 18pt, o 14pt in grassetto — ha diritto a 3:1 in AA.

Questo sostituisce il verificatore di contrasto?

No, viene dopo di lui. Il verificatore ti dice a che punto sei e rispetto a quali livelli; questo ti dice cosa fare di una bocciatura. Condividono la stessa matematica del contrasto, quindi i due non si contraddiranno mai.

Aiutaci a migliorare questo strumento

Hai trovato un errore, vuoi una modifica, o ti manca uno strumento?

/contrast-fixer

↑↓ per muoverti · Invio per aprire · Esc per chiudere