Preverjevalnik kontrasta izračuna razmerje kontrasta WCAG 2.1 med dvema barvama in ju oceni glede na pragove AA/AAA za navadno in veliko besedilo. Predogled v živo prikaže besedilo, izrisano v izbranih barvah, gumb "izberi ozadje strani" pa vzorči trenutno stran.
Dostopnost je vse pogosteje zahtevana — skladnost s standardom WCAG je v mnogih pravnih ureditvah zakonska zahteva, tudi kjer ni, pa slab kontrast odriva uporabnike. Preverjevalnik kontrasta vam takoj pove, ali poljubni dve barvi ustrezata standardom WCAG. Izberite ospredje in ozadje z izbirnikom barv ali prilepite vrednosti hex; orodje izračuna razmerje kontrasta po uradni formuli za svetlost WCAG in ga oceni glede na štiri pragove: AA navadno (≥4,5:1), AA veliko (≥3:1), AAA navadno (≥7:1) in AAA veliko (≥4,5:1). Vsak prag prikaže jasno oznako Uspešno/Neuspešno. Predogled v živo izriše veliko in navadno besedilo v izbranih barvah, tako da vidite dejanski vizualni učinek. Priročen gumb vzorči barvo ozadja telesa trenutne strani — uporabno pri preverjanju, ali kombinacija barv na resnični strani ustreza zahtevam. Vse teče lokalno v vašem brskalniku, brez nalaganja podatkov.
Uporablja uradno formulo za svetlost WCAG za izračun razmerja kontrasta. Rezultat je natančen in se ujema z vsakim skladnim preverjevalnikom dostopnosti.
Uspešno/neuspešno za AA navadno (≥4,5:1), AA veliko (≥3:1), AAA navadno (≥7:1), AAA veliko (≥4,5:1) — vse prikazano v mreži.
Izriše dejansko veliko in navadno besedilo v izbranih barvah, tako da poleg številčnega razmerja vidite tudi vizualni učinek.
En klik vzorči izračunano barvo ozadja telesa trenutne strani — uporabno za testiranje kombinacij v resničnem svetu.
Vnesite vrednost hex ali uporabite domači izbirnik barv. Vrednosti se dvosmerno usklajujejo, ko urejate katero koli od njiju.
En klik zamenja ospredje in ozadje — uporabno pri preverjanju obrnjenih tem ali stanj ob prehodu miške.
Pred dokončanjem barvne palete preverite vsako barvo besedila glede na njeno ozadje, da zagotovite skladnost z WCAG AA — s tem se izognete kasnejšemu popravljanju.
Uporabite "izberi ozadje strani" na resnični strani, nato prilepite dejansko barvo besedila — kršitve dostopnosti odkrijete v nekaj minutah brez odpiranja orodja Lighthouse.
Kadar blagovna znamka izbere barvo, ki morda ne bi ustrezala zahtevam dostopnosti, uporabite preverjevalnik, da najdete najbližjo skladno različico (temnejši/svetlejši odtenek).
Preverite, ali barve stanj ob prehodu miške, aktivnosti in onemogočenosti še vedno izpolnjujejo zahteve glede kontrasta, ne le privzeto stanje.
Temne teme pogosto ne dosežejo zadostnega kontrasta pri sivem besedilu na sivem ozadju. Preverite svoje najtemnejše sive odtenke glede na najtemnejša ozadja, da to odkrijete.
Kliknite ikono Kontrast v vrstici DevSuite Pro. Odpre se plošča s poljema za barvo ospredja in ozadja.
Za vsako uporabite izbirnik barv ali prilepite vrednost hex. Predogled v živo se posodobi ob vsaki spremembi barve.
Velika številka (npr. 4,8:1) je razmerje kontrasta. Višje je bolje. 3 je absolutni minimum, 4,5 pa je cilj za navadno besedilo.
Oznake uspešno/neuspešno za AA in AAA, za navadno in veliko besedilo, na hiter pogled pokažejo, za kaj vaša kombinacija ustreza.
Če ne uspe, prilagodite barve. Potemnite ospredje ali posvetlite ozadje (ali obratno), dokler ciljna raven ne pokaže Uspešno.
Namestite DevSuite Pro brezplačno in odklenite več kot 64 orodij za razvijalce za svoj brskalnik.