🔍 Review i QA

Kontrast kolorów — co to jest?

Stosunek jasności między kolorem tekstu a kolorem tła, wyrażany jako proporcja (np. 4.5:1). WCAG wymaga minimum 4.5:1 dla normalnego tekstu i 3:1 dla dużego tekstu na poziomie AA.

Jak to działa?

Kontrast mierzy się jako stosunek luminancji dwóch kolorów. 1:1 to brak kontrastu (biały na białym), 21:1 to maksymalny kontrast (czarny na białym). Narzędzia jak Colour Contrast Analyser, Stark (plugin Figma) czy wbudowany DevTools w Chrome obliczają ten stosunek automatycznie. Na przykład, jasny szary tekst (#999) na białym tle (#FFF) daje kontrast 2.85:1, co jest zbyt niskie. Ciemniejszy szary (#595959) na białym tle daje 7.0:1, co spełnia WCAG AA.

Dlaczego to ważne?

Niski kontrast to jeden z najczęstszych błędów dostępności. Dotyka nie tylko osób z zaburzeniami wzroku, ale każdego, kto czyta na telefonie w pełnym słońcu.

Powiązane pojęcia

Chcesz wiedzieć więcej?

Sprawdź kontrast kolorów w swoim projekcie

Sprawdź 7 narzedzi do Design Systemu →