⤺ próbnik kolorów

Tester kontrastu kolorów

Analizator kontrastu kolorów tekstu i tła bazujący na formule WCAG (Web Content Accessibility Guideline).


Proporcje kontrastu
7.50
Ocena kontrastu
5/5
Ocena kontrastu normalnego tekstu
3/3
Ocena kontrastu dużego tekstu
3/3
Przykład nr 3

Każda osoba ma swój własny kolor.

Haruki Murakami, Bezbarwny Tsukuru Tazaki i lata jego pielgrzymstwa

Jak to działa?

Nasz tester kontrastu kolorów bazuje na wytycznych dotyczących dostępności treści internetowych (WCAG - Web Content Accessibility Guidelines).
Podstawowym parametrem jest proporcja kontrastu kolorów, która wyliczana jest według specjalnej formuły.
Według WCAG poziom AA (minimalny) wymaga, aby współczynnik kontrastu wynosił co najmniej 4.5:1 dla normalnego tekstu i 3:1 dla dużego tekstu.
Poziom AAA (podwyższony) wymaga, aby współczynnik kontrastu wynosił co najmniej 7:1 dla normalnego tekstu i 4,5:1 dla dużego tekstu.
Duży tekst jest definiowany jako tekst 14-punktowy (zwykle 18,66px) pogrubiony lub większy, albo 18-punktowy (zwykle 24px) niepogrubiony lub większy.

Analiza wyników

Dla normalnego i wielkiego tekstu:
- 3/3: WCAG AAA (podwyższony) zaliczony.
- 2/3: WCAG AA (minimum) zaliczony.
- 1/3: Test niezaliczony.

Współczynnik kontrastu powyżej 12.00

Wynik idealny dla każdego rodzaju tekstu.

Współczynnik kontrastu 7.00-12.00

Normalny tekst:
- WCAG AA (minimalny): zaliczony
- WCAG AAA (podwyższony): zaliczony
Duży tekst:
- WCAG AA (minimalny): zaliczony
- WCAG AAA (podwyższony): zaliczony

Współczynnik kontrastu 4.50-6.99

Normalny tekst:
- WCAG AA (minimalny): zaliczony
- WCAG AAA (podwyższony): niezaliczony
Duży tekst:
- WCAG AA (minimalny): zaliczony
- WCAG AAA (podwyższony): zaliczony

Współczynnik kontrastu 3.00-4.49

Normalny tekst:
- WCAG AA (minimalny): niezaliczony
- WCAG AAA (podwyższony): niezaliczony
Duży tekst:
- WCAG AA (minimalny): zaliczony
- WCAG AAA (podwyższony): niezaliczony

Współczynnik kontrastu poniżej 3.00

Normalny tekst:
- WCAG AA (minimalny): niezaliczony
- WCAG AAA (podwyższony): niezaliczony
Duży tekst:
- WCAG AA (minimalny): niezaliczony
- WCAG AAA (podwyższony): niezaliczony