Jak używać
- Wpisz lub wybierz kolor tekstu.
- Wpisz lub wybierz kolor tła.
- Odczytaj współczynnik i wyniki WCAG AA oraz AAA.
Opis opcji
- Zwykły tekst
- WCAG AA wymaga kontrastu 4,5:1, a AAA 7:1 dla zwykłego tekstu.
- Duży tekst
- WCAG AA wymaga 3:1, a AAA 4,5:1 dla dużego tekstu.
- Jasność względna
- Współczynnik jest obliczany z jasności liniowej kolorów zgodnie z definicją WCAG.
Jak obliczany jest współczynnik
Każdy kolor jest zamieniany z sRGB na światło liniowe, a następnie na luminancję względną:
linear = c ÷ 12.92 if c ≤ 0.04045
linear = ((c + 0.055) ÷ 1.055) ^ 2.4 otherwise (c is 0–1)
L = 0.2126 × R + 0.7152 × G + 0.0722 × B
ratio = (L_lighter + 0.05) ÷ (L_darker + 0.05)
Zielony liczy się najbardziej, ponieważ oko jest na niego najbardziej wrażliwe. Kilka wyników na białym tle:
| Kolor tekstu | Współczynnik | Wynik |
|---|---|---|
| #000000 | 21 : 1 | AAA |
| #0066cc | 5,57 : 1 | AA — zwykły tekst, nie AAA — zwykły tekst |
| #767676 | 4,54 : 1 | AA — zwykły tekst |
| #777777 | 4,48 : 1 | Nie spełnia AA dla zwykłego tekstu, spełnia dla dużego tekstu |
Definicje WCAG znajdziesz w Understanding Success Criterion 1.4.3.
Najczęściej zadawane pytania
Jaki kontrast jest dobry dla tekstu?
Minimum WCAG AA to 4,5:1 dla zwykłego tekstu i 3:1 dla dużego.
Czy 100% zgodności oznacza dobrą dostępność?
Nie. Kontrast to tylko jeden element dostępności; znaczenie mają też rozmiar, krój, focus i semantyka.
Czy narzędzie obsługuje RGB i HSL?
Tak, możesz wpisywać popularne zapisy kolorów CSS.
Prywatność
To narzędzie działa w całości w przeglądarce. Twoje pliki i tekst są przetwarzane na Twoim urządzeniu i nigdy nie trafiają na nasze serwery.