Kontroler Kontrastu Kolorów

    Przetestuj współczynnik kontrastu między kolorami pierwszego planu i tła, aby zapewnić dostępność.

    1.00:1
    Kontrast
    Fail
    Bardzo słaby

    Normalny tekst

    AA (4.5:1)
    AAA (7:1)

    Duży tekst

    AA (3:1)
    AAA (4.5:1)
    Black
    #000000
    Eastern Blue
    #2596be

    Szybkie poprawki

    Aa

    Tytuł podglądu

    Szybki brązowy lis przeskakuje nad leniwym psem

    Przykład małego tekstu (12px)

    Tekst
    #000000
    Kontekst
    #2596be

    Standardy WCAG

    Level AA

    Minimalny współczynnik kontrastu 4,5:1 dla normalnego tekstu i 3:1 dla dużego tekstu. Wymagane dla większości stron internetowych.

    Level AAA

    Zwiększony współczynnik kontrastu 7:1 dla normalnego tekstu i 4,5:1 dla dużego tekstu. Zalecane dla optymalnej dostępności.

    Niewystarczający kontrast dla wszystkich rozmiarów tekstu - nie spełnia standardów WCAG.

    Kontroler Kontrastu Kolorów

    Oblicz współczynnik kontrastu kolorów tekstu i tła.

    Wybierz kolor za pomocą próbnika kolorów dla tekstu i tła lub wprowadź kolor w formacie szesnastkowym RGB (np. #259 lub #2596BE). Możesz dostosować suwak, aby wybrać kolor. Wytyczne dotyczące Dostępności Treści Internetowych (WCAG) zawierają specjalne kryteria, które pomagają ustalić, czy tekst jest czytelny dla użytkowników. Kryteria te wykorzystują algorytm do mapowania kombinacji kolorów na porównywalne proporcje. Korzystając z tej formuły, WCAG stwierdza, że współczynnik kontrastu 4.5:1 między tekstem a tłem jest odpowiedni dla zwykłego tekstu, a duży tekst (18pt lub większy, lub 14pt lub większy i pogrubiony) powinien mieć współczynnik kontrastu co najmniej 3:1.

    Kluczowe cechy

    • Obliczanie współczynnika kontrastu w czasie rzeczywistym
    • Sprawdzanie zgodności z WCAG AA i AAA
    • Suwaki HSL do precyzyjnego dostrajania
    • Wiele formatów podglądu

    Narzędzia zaawansowane

    • Automatyczne ustalanie kolorów
    • Próbki tekstu i tła
    • Wykrywanie nazwy koloru
    • Wyniki eksportu