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
Bouquet
#ae809e

Brza rješenja

Aa

Naslov pregleda

Brza smeđa lisica skače preko lijenog psa

Primjer malog teksta (12px)

Tekst
#ffffff
Pozadina
#ae809e

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 zadovoljava WCAG standarde.

Provjera kontrasta boja

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

Odaberi boju koristeći color picker 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 utvrditi je li tekst čitljiv za korisnike s vidom. Ovi kriteriji koriste poseban algoritam za mapiranje kombinacija boja u usporedive omjere. Prema ovoj formuli, 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 barem omjer kontrasta boja 3:1.

Ključne značajke

  • Izračun omjera kontrasta 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
  • Uzorkovanje teksta i pozadine
  • Detekcija naziva boja
  • Izvoz rezultata