Przejdź do treści
helpyself

Naprawa kontrastu

Local only — nothing is uploaded unless you save or share it.

Naprawa kontrastu kolorów — najbliższy dostępny kolor, który przechodzi WCAG AA.

  1. Podaj kolor tekstu i kolor tła, które oblewają.
  2. Wybierz potrzebny poziom WCAG — AA to zwykły cel dla tekstu ciągłego.
  3. Zdecyduj, który kolor może się zmienić, albo pozwól ruszyć tym bliższym.
  4. Skopiuj podpowiedziany kolor albo wybierz inną możliwość z listy.
Zapisz to narzędzie

Miej Naprawa kontrastu pod ręką

Dodaj do zakładek

O tym narzędziu

Wiedza, że para kolorów oblewa, to dopiero połowa odpowiedzi. To jest naprawa kontrastu na drugą połowę: daj jej oblewającą parę, a odda najbliższy dostępny kolor, który przechodzi. Sprawdzarka kontrastu mówi, że 3,1:1 nie wystarcza, i zostawia cię ze zgadywaniem odcieni, aż któryś się przyjmie — i tak właśnie kolory marki po cichu stają się tym, co przeszło jako pierwsze. To znajduje najbliższy kolor, który działa. Rusza jasność i nic więcej, więc twój odcień i nasycenie przeżywają: wynik jest rozpoznawalnie tym kolorem, który wybrałeś, trochę jaśniejszym albo ciemniejszym, a nie innym kolorem, który przypadkiem przeskoczył poprzeczkę. I ogląda każdą dopuszczalną jasność, zamiast zatrzymywać się na pierwszym trafieniu, więc kolor, któremu wystarczy zmiana o 3 %, dostaje zmianę o 3 %. Ty wybierasz, który kolor może się ruszyć. Palety marek zwykle jeden z dwóch zamrażają — tłem jest strona albo kolorem tekstu jest logo — a podpowiedź zmieniająca ten niewłaściwy nie przydaje się do niczego. Poproś o poprawkę tekstu, tła albo tego, co bliżej. Są wszystkie cztery stopnie WCAG: AA na 4,5:1 dla tekstu ciągłego, AA dla dużego tekstu na 3:1 przy nagłówkach 18 punktów albo 14 punktów pogrubionych, oraz surowsze poziomy AAA na 7:1 i 4,5:1. Wszystko działa w twojej przeglądarce.

Najczęstsze pytania

Dlaczego zmienia tylko jasność?

Bo kontrast jest funkcją luminancji względnej, a z odcienia, nasycenia i jasności tylko jasność rusza luminancję w sposób znaczący. Zmiana odcienia dałaby kolor, który przechodzi i nie jest twój. Zachowanie odcienia i nasycenia znaczy, że poprawka nadal wygląda jak wybrany przez ciebie kolor.

Który kolor jest najbliższym przechodzącym?

Ten, którego jasność ruszyła się najmniej. Próbowana jest każda wartość od 0 do 100, a wygrywa najmniejsza zmiana, która przeskakuje twój poziom, więc nigdy nie prosi się ciebie o zejście ciemniej, niż trzeba.

A jeśli nic nie przechodzi?

Powie to wprost. Na średnio szarym tle AAA na 7:1 jest nieosiągalne nawet czystą czernią czy czystą bielą — żaden odcień żadnego koloru tego nie zrobi. Uczciwą odpowiedzią jest wtedy zmiana drugiego koloru i właśnie po to jest wybór, co wolno ruszyć.

W który poziom WCAG celować?

AA na 4,5:1 dla zwykłego tekstu ciągłego jest w większości miejsc wymogiem prawa, w tym w europejskiej dyrektywie o dostępności. AAA na 7:1 warto brać dla dłuższego czytania. Duży tekst — 18 punktów albo 14 punktów pogrubione — ma na AA prawo do 3:1.

Czy to zastępuje sprawdzarkę kontrastu?

Nie, idzie po niej. Sprawdzarka mówi, gdzie stoisz i wobec których poziomów; ta mówi, co zrobić z oblaniem. Dzielą tę samą matematykę kontrastu, więc obie nigdy nie będą ze sobą sprzeczne.

Pomóż ulepszyć to narzędzie

Znalazłeś błąd, chcesz zmiany albo brakuje Ci jakiegoś narzędzia?

/contrast-fixer

↑↓ nawigacja · Enter otwiera · Esc zamyka