Griglia di contrasto

Un sistema di design non è un elenco di colori, è un elenco di abbinamenti — e la domanda che salta fuori davvero è quale di questi può stare su quale. Verificarlo una coppia alla volta significa n² visite a un verificatore di contrasto. Per una palette di otto sono sessantaquattro verifiche, ed è il motivo per cui nessuno lo fa e per cui i sistemi di design escono con combinazioni che nessuno ha mai provato. Questo è un verificatore di contrasto per palette che le fa tutte insieme — una matrice di colori WCAG per l'intero insieme. Incolla la tua palette e ogni colore viene verificato come testo contro ogni colore come sfondo, con il rapporto di contrasto e il voto WCAG in ogni cella. Il verde supera il livello che hai scelto, l'ambra supera solo l'asticella più bassa del testo grande, il rosso non passa. Incollala nella forma che hai già. Hex, rgb(), hsl() o nomi di colore CSS, separati da a capo, virgole o spazi, con la sintassi delle proprietà personalizzate ancora attaccata se è quello che hai copiato — legge tutto e ti dice ciò che non è riuscito a leggere. La griglia è anche la cosa che vale la pena conservare. È fatta per essere catturata di schermata dritta in una specifica di design o in una pull request, perché la verifica avviene una volta e l'immagine viene usata per un anno. Tutto funziona nel tuo browser.