Provjera kontrasta boja

Testiraj omjer kontrasta između boje prednjeg plana i pozadine kako bi osigurao pristupačnost.

1.00:1
Kontrast
Fail
Vrlo loše

Normalan tekst

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

Veliki tekst

AA (3:1)
AAA (4.5:1)
White
#ffffff
Black
#b400ff

Brza rješenja

Aa

Naslov pregleda

Brza smeđa lisica skače preko lijenog psa

Primjer malog teksta (12px)

Tekst
#ffffff
Pozadina
#b400ff

WCAG standardi

Level AA

Minimalni omjer kontrasta 4.5:1 za normalan tekst i 3:1 za veliki tekst. Potrebno za većinu web stranica.

Level AAA

Poboljšani omjer kontrasta 7:1 za normalan tekst i 4.5:1 za veliki tekst. Preporučeno za optimalnu pristupačnost.

Nedovoljan kontrast za sve veličine teksta - ne ispunjava WCAG standarde.

Provjera kontrasta boja

Izračunaj omjer kontrasta između boje teksta i pozadine.

Izaberi boju koristeći selector boja za tekst i boju pozadine ili unesi boju u RGB heksadecimalnom formatu (npr. #259 ili #2596BE). Možeš prilagoditi klizač za odabir boje. Smjernice za pristupačnost web sadržaja (WCAG) imaju specifične smjernice koje pomažu u određivanju da li je tekst čitljiv za korisnike s vidom. Ovi kriteriji koriste poseban algoritam za mapiranje kombinacija boja u usporedive omjere. Koristeći ovu formulu, WCAG navodi da je omjer kontrasta boja 4.5:1 između teksta i pozadine adekvatan za običan tekst, a veliki tekst (18+ pt običan, ili 14+ pt podebljan) treba imati najmanje omjer kontrasta boja 3:1.

Ključne karakteristike

  • Izračunavanje kontrastnog omjera u stvarnom vremenu
  • Provjera usklađenosti s WCAG AA i AAA
  • HSL klizači za fino podešavanje
  • Višestruki formati pregleda

Napredni alati

  • Automatsko popravljanje boja
  • Uzorke teksta i pozadine
  • Detekcija naziva boje
  • Izvoz rezultata