O tym narzędziu
Sprawdź współczynniki kontrastu kolorów między tekstem na pierwszym planie a kolorami tła zgodnie z wytycznymi dostępności WCAG 2.1. Wprowadź kolory jako kody szesnastkowe, wartości RGB lub wartości HSL i natychmiast zobacz współczynnik kontrastu wraz z wynikami pozytywny/negatywny dla zgodności WCAG AA i AAA zarówno przy normalnym, jak i dużym rozmiarze tekstu.
Często zadawane pytania
- Jaki współczynnik kontrastu jest wymagany, aby zachować zgodność z WCAG?
- WCAG AA wymaga formatu 4,5:1 w przypadku zwykłego tekstu i 3:1 w przypadku dużego tekstu (pogrubienie 18 pkt+ lub 14 pkt+). WCAG AAA wymaga 7:1 dla normalnego tekstu i 4,5:1 dla dużego tekstu. Maksymalny możliwy stosunek wynosi 21:1 (czerń na białym).
- Dlaczego kontrast kolorów ma znaczenie?
- Wystarczający kontrast zapewnia czytelność tekstu użytkownikom niedowidzącym, daltonistom lub oglądającym ekrany w jasnym świetle słonecznym. Jest to również wymóg prawny wynikający z przepisów ADA i przepisów UE dotyczących dostępności dla wielu stron internetowych.
- Co w WCAG uważa się za „duży tekst”?
- Duży tekst definiuje się jako 18 punktów (24 piksele) i więcej w przypadku zwykłej grubości lub 14 punktów (18,66 piksela) i więcej w przypadku pogrubionego tekstu. Duży tekst ma mniejsze wymagania dotyczące kontrastu, ponieważ jest z natury łatwiejszy do odczytania.
- Czy to narzędzie sprawdza kontrast elementów nietekstowych?
- WCAG 2.1 wymaga współczynnika kontrastu 3:1 dla komponentów interfejsu użytkownika i obiektów graficznych (przyciski, ikony, pola formularzy). Możesz użyć tego narzędzia, aby je również zweryfikować — wystarczy wpisać kolor komponentu i tła.