candoya
SR

Color contrast checker

Radi u celosti u pregledaču - bez otpremanja i bez registracije.

Odnos kontrasta
ProlazAA · Normalan tekstpotrebno 4.5:1
ProlazAA · Veliki tekstpotrebno 3:1
PadAAA · Normalan tekstpotrebno 7:1
ProlazAAA · Veliki tekstpotrebno 4.5:1

Veliki = 18pt (24px), ili 14pt (18,66px) podebljano.

Šta je color contrast checker?

Color contrast checker meri odnos kontrasta između boje teksta i pozadine i pokazuje da li kombinacija ispunjava WCAG standarde pristupačnosti. Rezultat je broj od 1:1 do 21:1, uz oznake prolaz ili pad za AA i AAA nivo - posebno za normalan i za veliki tekst.

Kako se koristi

  1. 1Unesite boje. Ukucajte hex kod, rgb() vrednost ili CSS naziv boje za tekst i pozadinu, ili izaberite boju pomoću birača.
  2. 2Pročitajte odnos. Odnos kontrasta se osvežava uživo, uz pregled teksta na odabranoj pozadini.
  3. 3Proverite oznake. Svaka oznaka pokazuje prolaz ili pad za WCAG AA i AAA nivo, za normalan i za veliki tekst.

Kome je namenjen

Alat koristi zvaničnu WCAG formulu za relativnu luminancu, pa se vrednosti poklapaju sa WebAIM checkerom i većinom pristupačnosnih revizija. Sve se izvršava u pregledaču - boje se nikada ne otpremaju, bez ograničenja broja provera.

Česta pitanja

Da li je color contrast checker besplatan?

Jeste - potpuno je besplatan, bez registracije i bez ograničenja. Radi u celosti u vašem pregledaču.

Koji odnos kontrasta je potreban za WCAG AA?

WCAG 2.1 nivo AA zahteva odnos kontrasta od najmanje 4,5:1 za normalan tekst i 3:1 za veliki tekst. Nivo AAA podiže te granice na 7:1 za normalan tekst i 4,5:1 za veliki tekst.

Šta se smatra velikim tekstom?

Veliki tekst je najmanje 18pt (oko 24px) pri regularnoj debljini, ili 14pt (oko 18,66px) kada je podebljao. Za veliki tekst dozvoljava se niži odnos kontrasta jer su veći znakovi lakši za čitanje.

Kako se izračunava odnos kontrasta?

Formula je (L1 + 0,05) / (L2 + 0,05), gde su L1 i L2 relativna luminanca svetlije i tamnije boje. Luminanca se izračunava iz sRGB crvenog, zelenog i plavog kanala prema WCAG 2.x definiciji.

Podržava li hex, RGB i nazive boja?

Da. Možete uneti 3-, 4-, 6- ili 8-cifreni hex, rgb() i rgba() vrednosti, ili bilo koji CSS naziv boje kao što je 'teal'. Boju možete izabrati i pomoću birača.

Zašto isti odnos kontrasta nekad prolazi, a nekad pada?

Traženi odnos zavisi od veličine teksta i ciljnog nivoa. Odnos 3,5:1 pada AA za normalan tekst, ali prolazi AA za veliki tekst - uvek proveravajte prema veličini i nivou koji zaista koristite.