Kontroler kontrastu kolorów
Upewnij się, że Twoja strona internetowa jest czytelna dla wszystkich. Nasze bezpłatne narzędzie do sprawdzania kontrastu kolorów oblicza dokładny stosunek między kolorem tekstu a tłem, weryfikując zgodność z wytycznymi dostępu WCAG.
Sample Heading
This is an example paragraph to test readability and visual contrast.
WCAG 2.1 Compliance Status
Czym jest Checker kontrastu kolorów - narzędzie dostępności WCAG?
Checker kontrastu kolorów to narzędzie do dostępności stron internetowych. Matematycznie ocenia względną luminancję koloru pierwszego planu (tekstu) względem koloru tła, aby określić, czy istnieje wystarczająca różnica wizualna, aby osoby niedowidzące mogły komfortowo czytać tekst.
Jak korzystać z Checker kontrastu kolorów - narzędzie dostępności WCAG
- Wprowadź kod HEX dla swojego koloru tekstu/koloru pierwszoplanowego.
- Wprowadź kod HEX dla koloru tła.
- Narzędzie oblicza współczynnik kontrastu (np. 4,5:1).
- Wyświetla ocenę Zaliczone/Nie zaliczone dla standardów WCAG AA i AAA.
Przykład
Testujesz czysty czarny tekst (#000000) na czystym białym tle (#FFFFFF). Narzędzie oblicza maksymalny możliwy współczynnik kontrastu wynoszący dokładnie 21:1, łatwo spełniając wszystkie wymagania dostępności AAA.
Zrozumienie Twoich wyników
Wyższy współczynnik oznacza, że tekst jest łatwiejszy do czytania. Wytyczne dotyczące dostępności treści internetowych (WCAG) wymagają minimalnego współczynnika 4,5:1 dla zwykłego tekstu (standard AA) oraz 7:1 dla rygorystycznej dostępności (standard AAA).
Częste przypadki użycia
- Audyty dostępności stron internetowych: Zapewnienie, że strona korporacyjna nie narusza przepisów dotyczących zgodności z ADA w zakresie czytelności.
- Projektowanie UI/UX: Sprawdzanie, czy jasnoszary tekst zastępczy wewnątrz białego pola wprowadzania jest zbyt trudny do odczytania.
- Wytyczne dotyczące marki: Sprawdzanie, czy kolory marki mogą być bezpiecznie nakładane jeden na drugi w materiałach marketingowych.
Jak to działa
Narzędzie konwertuje oba kody HEX na RGB, stosuje określony wzór matematyczny do obliczenia 'względnej luminancji' obu kolorów, a następnie dzieli jaśniejszą luminancję przez ciemniejszą luminancję. Wynikiem jest stosunek między 1:1 (brak kontrastu) a 21:1 (maksymalny kontrast).
Wskazówki i uwagi dotyczące dokładności
- •Duży tekst (powyżej 18 pkt lub 14 pkt pogrubionego) jest łatwiejszy do czytania, dlatego WCAG wymaga tylko niższego współczynnika 3:1, aby spełnić standard AA.
- •Daltonizm wpływa na postrzeganie barw, ale względny kontrast luminancji pozostaje najważniejszym czynnikiem dla czytelności.
Często zadawane pytania
Co się stanie, jeśli moje kolory nie przejdą kontroli?
Jeśli zawiodą, Twój tekst będzie bardzo trudny do odczytania dla osób z wadą wzroku lub daltonizmem. Powinieneś zaciemnić kolor tekstu lub rozjaśnić kolor tła, aż stosunek osiągnie co najmniej 4,5:1.
Czy 21:1 to najlepszy kontrast?
Matematycznie, tak. Jednak czarny tekst na białym tle (21:1) może powodować zmęczenie oczu lub 'halo' u niektórych użytkowników z dysleksją. Bardzo ciemny szary (np. #222222) na lekko białym tle jest często preferowany.
Powiązane narzędzia
Wybór koloru
Szukasz dokładnego odcienia niebieskiego dla tła swojej strony internetowej? Nasz darmowy internetowy Wybierak Kolorów pozwala wizualnie wybierać kolory i podaje dokładne formaty kodów, których potrzebują deweloperzy i projektanci.
Generator Palety Kolorów
Rozpoczynasz nowy projekt graficzny, ale utknąłeś przy wyborze kolorów? Nasz darmowy Generator Palet Kolorów automatycznie tworzy oszałamiające, matematycznie zrównoważone schematy kolorów, które pobudzą Twoją kreatywność.
Konwerter HEX na RGB
Masz kod koloru w formacie heksadecymalnym, ale potrzebujesz wartości RGB, aby dodać kanał przezroczystości w CSS? Nasz darmowy konwerter HEX na RGB natychmiast przekształca ciągi kolorów szesnastkowych na standardowe liczby całkowite Red, Green, Blue.
Darmowy Formatizer JSON Online
Praca z nieufomatyzowanym JSON bywa frustrująca dla deweloperów. Nasz darmowy Formatizer JSON pozwala błyskawicznie upiększyć, zwalidować i sparsować kod JSON. Narzędzie automatycznie dodaje wcięcia i podświetla błędy, abyś mógł od razu je poprawić.
Popularny
Kalkulator Wieku
Chcesz wiedzieć, ile masz dokładnie lat? Nasz darmowy kalkulator wieku podaje precyzyjną odpowiedź w kilka sekund — w latach, miesiącach, dniach oraz łącznej liczbie przeżytych dni. Bez rejestracji — wszystkie obliczenia odbywają się lokalnie w Twojej przeglądarce.
Kalkulator procentowy
Masz problemy z matematyką procentową? Nasz darmowy Kalkulator Procentów natychmiast rozwiązuje wszystkie standardowe zadania procentowe, od obliczania rabatów po wyliczanie podatków.
Zastrzeżenie: To narzędzie oblicza kontrast na podstawie standardowego algorytmu WCAG 2.1 dla luminancji względnej.