Verificator de contrast
Verificați rapoartele de contrast WCAG ale perechilor de culori, cu verdicte AA și AAA și sugestii de remediere.
Verificator de contrast
Lipiți perechile de prim-plan și de fundal, câte una pe linie — #7a1f2b pe #ffffff, #333, #eee sau rgb(0, 0, 0) #fff — și raportul de contrast WCAG 2 al fiecărei perechi revine instantaneu, cu un verdict de trecere sau eșec pentru fiecare nivel de conformitate. Raportul variază de la 1: 1 (fără contrast deloc) la 21: 1 (negru pe alb) și este calculat din lumina relativă exact așa cum o definesc ghidurile, astfel încât numerele sunt de acord cu inspectorii browserului și instrumentele de audit.
WCAG numește două niveluri. AA, cea mai mare referință la legi și contracte, necesită 4,5: 1 pentru text normal și 3: 1 pentru text mare. AAA, ținta mai strictă, cere 7: 1 și 4,5: 1. Textul contează la fel de mare de la 18 pt (aproximativ 24 px) în greutate normală sau de la 14 pt (aproximativ 18,7 px) în aldine - de aceea un titlu poate trece la un raport în care un paragraf nu reușește. Raportul precizează toate cele patru cecuri per pereche; comutați ieșirea la Compact pentru o linie per pereche, care este cea mai rapidă citire atunci când măturați o paletă întreagă.
Când o pereche ratează AA pentru textul normal, activați „Sugerare remediere” și instrumentul întunecă sau luminează primul plan în pași mici de luminozitate, păstrându-și nuanța, până când ajunge la 4,5 : 1 — apoi imprimă cel mai apropiat hex de trecere gata de lipit înapoi în foaia de stil.
Totul rulează în browserul tău; paletele de marcă nelansate nu părăsesc niciodată dispozitivul dvs. Culorile pot fi hexadecimale de 3 sau 6 cifre, cu sau fără hash, rgb() sau rgba(), sau un nume CSS comun - cele 16 de bază plus cele populare extinse. Lista completă de 148 de nume CSS nu este în mod deliberat transportată, așa că scrieți numele exotice ca hex. O linie care nu este o pereche de culori se notează cu calm, iar restul continuă să se prelucreze.