Zacznij od zwykłego tekstu
To próg AA dla tekstu w akapitach, etykietach i przyciskach. Dla poziomu AAA zwykły tekst potrzebuje 7:1.
Narzędzia CometWeb
Sprawdzacz współczynnika kontrastu
Wybierz kolor tekstu i tła. Zobacz, jak razem wyglądają i czy spełniają progi kontrastu WCAG 2.2.
DarmoweBez zakładania konta
Kolory
Wklej kod HEX lub wybierz kolor z palety.
Obliczenia odbywają się w przeglądarce. Nie wysyłasz kolorów do analizy.
Sprawdzone pary
Współczynnik kontrastu
19,17: 1
AA, Zwykły: spełnia
Podgląd: nagłówek 24 px, tekst 16 px
Wielki tytuł nagłówka
Pchnąć w tę łódź jeża lub osiem skrzyń fig.
0123456789, @ & %
AA, Zwykły≥ 4,5:1spełnia
AA, Duży≥ 3:1spełnia
AAA, Zwykły≥ 7:1spełnia
AAA, Duży≥ 4,5:1spełnia
Wynik wyświetlamy po zaokrągleniu. Ocena progów korzysta z pełnej wartości.
Który próg wybrać?
Sprawdzasz jedną parę nieprzezroczystych kolorów, nie dostępność całej strony. Gradienty, zdjęcia i przezroczystość wymagają sprawdzenia rzeczywistego tła pod tekstem.
Zasady kontrastu w W3C ↗Duży tekst ma inny próg
AA dla tekstu od 24 px lub pogrubionego od około 18,67 px. Na poziomie AAA duży tekst potrzebuje 4,5:1.
Sprawdź też gotowy projekt
Zobacz tekst w jego rzeczywistym rozmiarze. Sprawdź osobno linki, placeholdery i stany hover oraz focus. Dobry wynik tej pary nie ocenia pozostałych elementów.
Rozjaśnia lub przyciemnia kolor tekstu, aż osiągnie próg 4,5:1 na wybranym tle. Tło pozostaje bez zmian. Sprawdź nowy kolor w projekcie, ponieważ może różnić się od koloru marki.
Nie. Narzędzie oblicza kontrast dwóch kolorów i porównuje go z progami dla tekstu. Nie bada strony, obsługi klawiatury, opisów obrazów ani innych wymagań dostępności.
Kalkulator przyjmuje HEX z 3 lub 6 cyframi, bez kanału alfa. Dla przezroczystego tekstu najpierw ustal wynikowy kolor na konkretnym tle. Dla zdjęcia lub gradientu sprawdź najmniej kontrastowe miejsce pod tekstem.
To narzędzie łata jeden problem naraz
Automatyczne testy WCAG 2.2 z listą napraw i planem działania.