Bezpłatny moduł sprawdzania kontrastu kolorów WCAG: przetestuj tekst i kolory tła pod kątem zgodności z AA i AAA w swojej przeglądarce. Wprowadź wartości szesnastkowe lub rgb, sprawdź współczynnik kontrastu i natychmiast zalicz. Bez logowania, bez przesyłania.
Oblicza współczynnik kontrastu WCAG 2.x pomiędzy kolorem pierwszego planu (tekstu) a kolorem tła przy użyciu względnej luminancji sRGB. Otrzymujesz stosunek liczbowy (na przykład 4,52:1) plus pozytywny/negatywny dla progów WCAG AA i AAA dla zwykłego tekstu i dużego tekstu. Jest to narzędzie wspomagające kontrolę jakości projektu, a nie w pełni zautomatyzowany audyt dostępności całej witryny.
Szesnastkowo (#RGB, #RRGGBB, #RRGGBBAA), rgb() i rgba(). Wklej wartości palety marki z tokenów Figma, zmiennych CSS lub dokumentów projektowych. Krótki hex, taki jak #ffff, rozwija się do #ffffff przed obliczeniem luminancji.
AA to wspólna podstawa prawna i produktowa: 4,5:1 dla zwykłego tekstu, 3:1 dla dużego tekstu. AAA jest bardziej rygorystyczne: 7:1 normalne, 4,5:1 duże. Wiele witryn marketingowych kieruje reklamy na AA w przypadku treści, a AAA tylko w przypadku nagłówków głównych lub interfejsu użytkownika wysokiego ryzyka. To narzędzie pokazuje oba, dzięki czemu możesz wybrać cel możliwy do obrony za pomocą projektu.
Duży tekst ma co najmniej 18 punktów (24 piksele CSS) o normalnej grubości lub co najmniej 14 punktów pogrubienia (około 18,66 pikseli CSS). Guziki, podpisy i drobny druk często nie spełniają wymagań AA, nawet gdy nagłówki przechodzą pomyślnie — sprawdzaj każdy wysyłany rozmiar, a nie tylko próbkę H1.
Nie. Analizowanie i obliczanie luminancji odbywa się całkowicie w przeglądarce. Niepublikowane eksperymenty z paletami i kolory klienta NDA pozostaną na Twoim urządzeniu. Po zakończeniu wyczyść pola na udostępnionych komputerach.
Wartości rgba i #RRGGBBAA są analizowane, ale kontrast jest oceniany na nieprzezroczystych kanałach sRGB — moduł sprawdzający nie składa tekstu alfa na tła fotograficzne. W przypadku tekstu na obrazach wypróbuj efektywny kolor kopii lub najpierw użyj jednolitej nakładki, a następnie sprawdź ponownie.
Tak. Bezpłatnie, bez konieczności logowania się w celu uzyskania współczynnika rdzenia i ścieżki Pass/Fail.