candoya
SL

Preverite barvni kontrast

Vse poteka v vašem brskalniku - brez nalaganja, brez registracije.

Razmerje kontrasta
UstreznoAA · Navadno besedilozahteva 4.5:1
UstreznoAA · Večje besedilozahteva 3:1
NeustreznoAAA · Navadno besedilozahteva 7:1
UstreznoAAA · Večje besedilozahteva 4.5:1

Večje = 18 točk (24 px) ali 14 točk (18,66 px) krepko.

Kaj je barvni kontrast?

Barvni kontrast meri razmerje med barvo besedila in barvo ozadja ter pokaže, ali kombinacija ustreza standardom dostopnosti WCAG. Rezultat je razmerje od 1:1 do 21:1, orodje pa prikaže, ali kombinacija prestane preizkus AA in AAA za navadno in večje besedilo.

Kako uporabljati

  1. 1Vnesite barve. Vnesite hex kodo, vrednost rgb() ali ime barve CSS za besedilo in ozadje - ali izberite barvo s prikazovalnikom.
  2. 2Preverite razmerje. Razmerje kontrasta se posodablja sproti skupaj s predogledom besedila na ozadju.
  3. 3Preverite oznake. Vsaka oznaka prikaže, ali kombinacija prestane WCAG AA in AAA za navadno in večje besedilo.

Komu je namenjeno

Orodje uporablja uradno WCAG formulo za relativno svetilnost, zato se rezultati ujemajo s preverjalnikom WebAIM in večino dostopnostnih revizij. Vse poteka v vašem brskalniku - barve niso nikoli prenesene na strežnik in ni nobenih omejitev.

Pogosta vprašanja

Je preverjalnik barvnega kontrasta brezplačen?

Da - v celoti brezplačen, brez prijave in brez omejitev. Deluje v vašem brskalniku.

Kakšno razmerje kontrasta zahteva WCAG AA?

WCAG 2.1 raven AA zahteva razmerje vsaj 4,5:1 za navadno besedilo in 3:1 za večje besedilo. Raven AAA zahteva 7:1 za navadno in 4,5:1 za večje besedilo.

Kaj se šteje za večje besedilo?

Večje besedilo je vsaj 18 točk (pribl. 24 px) pri navadni debelini ali 14 točk (pribl. 18,66 px) pri krepkem rezu. Za večje besedilo je dopuščeno nižje razmerje kontrasta, ker so večje črke lažje berljive.

Kako se izračuna razmerje kontrasta?

Formula je (L1 + 0,05) / (L2 + 0,05), kjer sta L1 in L2 relativna svetilnost svetlejše in temnejše barve. Svetilnost se izračuna iz kanalov sRGB rdeče, zelene in modre po definiciji WCAG 2.x.

Podpira hex, RGB in imena barv?

Da. Vnesete lahko 3-, 4-, 6- ali 8-mestne hex vrednosti, rgb() in rgba() vrednosti ter katerokoli ime CSS barve, na primer 'teal'. Na voljo je tudi prikazovalnik barv.

Zakaj isto razmerje enkrat prestane in drugič ne?

Zahtevano razmerje je odvisno od velikosti besedila in ravni, ki jo ciljate. Razmerje 3,5:1 ne prestane AA za navadno besedilo, prestane pa AA za večje besedilo - vedno preverite glede na dejansko velikost in raven.