Darmowy Sprawdzacz Kontrastu Kolorów
Testuj współczynniki kontrastu kolorów względem standardów dostępności WCAG 2.1. Sprawdź zgodność AA i AAA dla czytelności tekstu. Darmowy, natychmiastowy i prywatny.
Tester Kontrastu Kolorów sprawdza dowolną parę tło/tekst pod kątem standardów WCAG 2.1 AA i AAA, używając wzoru względnej luminancji. Pokazuje współczynnik kontrastu, zaliczenie/niezaliczenie według rozmiaru tekstu i komponentów UI, podgląd na żywo oraz symulację ślepoty barw dla protanopii, deuteranopii i tritanopii. Sugeruje zaliczające alternatywy, gdy para nie spełnia wymogów. Wszystko w przeglądarce. Stworzone przez FreeToolHub.
| Normalny tekst | Duży tekst | |
|---|---|---|
| WCAG AA | ✓ Zdany Wymaga współczynnika 4,5:1 | ✓ Zdany Wymaga współczynnika 3:1 |
| WCAG AAA | ✓ Zdany Wymaga współczynnika 7:1 | ✓ Zdany Wymaga współczynnika 4,5:1 |
| Komponenty UI | ✓ Zdany Wymaga współczynnika 3:1 (WCAG 2.1) | |
Często zadawane pytania
Czym jest współczynnik kontrastu kolorów?
Współczynnik kontrastu mierzy różnicę postrzeganej jasności między dwoma kolorami, wyrażoną jako stosunek od 1:1 (brak kontrastu) do 21:1 (maksymalny kontrast, czarny na białym). Jest obliczany przy użyciu formuły względnej luminancji WCAG.
Jaki współczynnik kontrastu jest potrzebny dla zgodności z WCAG?
WCAG AA wymaga minimalnego współczynnika kontrastu 4,5:1 dla normalnego tekstu i 3:1 dla dużego tekstu (18pt lub 14pt pogrubiony). WCAG AAA wymaga 7:1 dla normalnego tekstu i 4,5:1 dla dużego tekstu. Komponenty UI wymagają co najmniej 3:1 według WCAG 2.1.
Co liczy się jako "duży tekst" w WCAG?
Duży tekst jest zdefiniowany jako 18 punktów (24px) lub większy przy normalnej wadze, lub 14 punktów (około 18,66px) lub większy pogrubiony. Duży tekst ma niższe wymagania kontrastowe, ponieważ jest z natury łatwiejszy do odczytania.
Dlaczego kontrast kolorów jest ważny dla dostępności?
Około 1 na 12 mężczyzn i 1 na 200 kobiet ma jakąś formę zaburzenia widzenia barw. Tekst o niskim kontraście jest trudny lub niemożliwy do odczytania dla osób z osłabionym wzrokiem lub ślepotą barw. Odpowiedni kontrast zapewnia, że treść jest czytelna dla wszystkich.
Czy to narzędzie przechowuje moje wybory kolorów?
Nie. Wszystko działa lokalnie w przeglądarce. Żadne kolory, wyniki ani dane nie są wysyłane na serwer ani przechowywane. Twoja prywatność jest w pełni chroniona.
Jak działa funkcja sugerowania kolorów?
Gdy para kolorów nie spełnia poziomu WCAG, narzędzie automatycznie oblicza najbliższy kolor, który by przeszedł, dostosowując jasność w przestrzeni kolorów HSL, zachowując oryginalny odcień i nasycenie. Sugeruje zarówno ciemniejszy pierwszy plan, jak i jaśniejsze tło.