Sprawdzanie kontrastu

Sprawdzaj kolory tekstu i tła według WCAG 2.1 i APCA, z podglądem na żywo i poprawionym kolorem, który przechodzi — bezpośrednio w przeglądarce.

O narzędziu Sprawdzanie kontrastu

Co to jest

To narzędzie mierzy kontrast między kolorem tekstu a kolorem tła według dwóch standardów: klasycznego współczynnika WCAG 2.1 z poziomami AA i AAA oraz nowszej oceny APCA. Podgląd na żywo z nagłówkiem, tekstem, przyciskiem i plakietką pokazuje parę w ustawionym rozmiarze i grubości czcionki. Gdy para nie przechodzi, narzędzie proponuje najbliższy kolor, który przechodzi.

Główne funkcje

  • Współczynnik kontrastu WCAG 2.1 z AA i AAA dla zwykłego i dużego tekstu.
  • Ocena APCA Lc dla ciemnego tekstu na jasnym i jasnego na ciemnym.
  • Podgląd na żywo z Twoim rozmiarem i grubością czcionki.
  • Proponowany poprawiony kolor, który osiąga wymagany kontrast, stosowany jednym kliknięciem.
  • Symulacja widzenia: protanopia, deuteranopia, tritanopia i skala szarości.

Jak używać

  1. Wpisz kolor tekstu i kolor tła.
  2. Ustaw rozmiar i grubość czcionki, której używasz.
  3. Przeczytaj wyniki WCAG i APCA i sprawdź podgląd.
  4. Zastosuj proponowaną poprawkę, jeśli para nie przechodzi, a potem skopiuj kolory lub kod.

Kiedy się przydaje

  • Sprawdzić, czy kolor marki jest czytelny jako tekst na białym.
  • Spełnić wymagania dostępności publicznej strony.
  • Zobaczyć, jak parę kolorów widzą osoby z daltonizmem.

Prywatność i ograniczenia

Twoje dane

Kolory są sprawdzane w przeglądarce i nic nie trafia na serwer — witryna otrzymuje tylko anonimowe zdarzenie „otwarto narzędzie”. Wynik wysłany do innego narzędzia zostaje na tym urządzeniu przez 24 godziny w „Ostatniej aktywności”.

Ograniczenia

  • APCA to wciąż projekt dla przyszłych wersji WCAG; dzisiejsze wymogi prawne zwykle odwołują się do WCAG 2.1.
  • Symulacja widzenia jest przybliżona i nie pokaże dokładnie, co widzi każda osoba.

Najczęstsze pytania

WCAG czy APCA — czym się kierować?

WCAG 2.1 to dziś zwykle wymóg przepisów i audytów, więc to on musi przejść. APCA jest dokładniejszy dla nowoczesnych ekranów i cienkich czcionek — przydatna druga kontrola.

Co uznaje się za duży tekst?

W WCAG co najmniej 24 px zwykłego lub około 18,7 px pogrubionego. Duży tekst wymaga dla AA tylko 3:1 zamiast 4,5:1.

Jak działa proponowana poprawka?

Narzędzie zachowuje odcień i nasycenie koloru tekstu i zmienia tylko jego jasność — o najmniejszy krok, który daje wymagany współczynnik — a potem proponuje ten kolor.