Kalkulator Kontrastu Kolorów (WCAG)
Kalkulator Kontrastu Kolorów (WCAG)
Wpisz kolor pierwszego planu (tekstu) i kolor tła jako kody hex. To obliczy ich współczynnik kontrastu według wzoru WCAG i powie, które poziomy zgodności dostępności (AA, AAA) spełnia ta kombinacja.
- Wzór: Współczynnik Kontrastu = (L1 + 0.05) ÷ (L2 + 0.05), gdzie L1 i L2 to względna jasność jaśniejszego i ciemniejszego koloru według wzoru WCAG 2.x.
- Progi WCAG: AA wymaga 4.5:1 dla zwykłego tekstu i 3:1 dla dużego tekstu (18pt+ lub 14pt+ pogrubiony); AAA wymaga 7:1 dla zwykłego tekstu i 4.5:1 dla dużego tekstu.
- Działa całkowicie w przeglądarce: Twoje kolory są obliczane lokalnie za pomocą JavaScript i nigdy nie są wysyłane na serwer.
Co liczy się jako "duży tekst" dla niższego progu AA/AAA?
18pt (24px) zwykła grubość lub 14pt (~18.5px) pogrubiona lub większa — duży tekst jest łatwiejszy do odczytania przy niższym kontraście.
Moje kolory nie przechodzą WCAG AA — co powinienem zmienić?
Przyciemnij ciemniejszy kolor, rozjaśnij jaśniejszy, lub oba — nawet niewielkie zmiany jasności mogą znacznie zwiększyć współczynnik kontrastu.
Kalkulator Kontrastu Kolorów (WCAG)
Wpisz kolor pierwszego planu (tekstu) i kolor tła jako kody hex. To obliczy ich współczynnik kontrastu według wzoru WCAG i powie, które poziomy zgodności dostępności (AA, AAA) spełnia ta kombinacja.
- Wzór: Współczynnik Kontrastu = (L1 + 0.05) ÷ (L2 + 0.05), gdzie L1 i L2 to względna jasność jaśniejszego i ciemniejszego koloru według wzoru WCAG 2.x.
- Progi WCAG: AA wymaga 4.5:1 dla zwykłego tekstu i 3:1 dla dużego tekstu (18pt+ lub 14pt+ pogrubiony); AAA wymaga 7:1 dla zwykłego tekstu i 4.5:1 dla dużego tekstu.
- Działa całkowicie w przeglądarce: Twoje kolory są obliczane lokalnie za pomocą JavaScript i nigdy nie są wysyłane na serwer.
Co liczy się jako "duży tekst" dla niższego progu AA/AAA?
18pt (24px) zwykła grubość lub 14pt (~18.5px) pogrubiona lub większa — duży tekst jest łatwiejszy do odczytania przy niższym kontraście.
Moje kolory nie przechodzą WCAG AA — co powinienem zmienić?
Przyciemnij ciemniejszy kolor, rozjaśnij jaśniejszy, lub oba — nawet niewielkie zmiany jasności mogą znacznie zwiększyć współczynnik kontrastu.