Spalvų kontrasto tikrintuvas

Patikrink savo spalvas

Išbandyk spalvų derinius, kad įsitikintum, jog jie atitinka WCAG prieinamumo standartus teksto įskaitomumui.

1.00:1

Kontrastas

Neatitinka

Labai prasta

Įprastas tekstas

AA (4.5:1)

AAA (7:1)

Didelis tekstas

AA (3:1)

AAA (4.5:1)

Teksto spalva

Fono spalva

Greiti pataisymai

Peržiūros pavadinimas

Greita ruda lapė peršoka per tingų šunį

Mažo teksto pavyzdys (12px)

Tekstas

#ffffff

Fonas

#e57000

WCAG standartai

AA lygis

Minimalus kontrasto santykis 4.5:1 įprastam tekstui ir 3:1 dideliam tekstui. Reikalingas daugumai svetainių.

AAA lygis

Pagerintas kontrasto santykis 7:1 įprastam tekstui ir 4.5:1 dideliam tekstui. Rekomenduojamas optimaliam prieinamumui.

Nepakankamas kontrastas visiems teksto dydžiams - neatitinka WCAG standartų.

Apskaičiuok teksto ir fono spalvų kontrasto santykį.

Pasirink spalvą naudodamas spalvų parinkiklį tekstui ir fono spalvai arba įvesk spalvą RGB šešioliktainiu formatu (pvz., #259 arba #2596BE). Gali reguliuoti slankiklį, kad pasirinktum spalvą. Žiniatinklio turinio prieinamumo gairės (WCAG) turi konkrečią gairę, padedančią nustatyti, ar tekstas yra įskaitomas regintiems vartotojams. Šis kriterijus naudoja tam tikrą algoritmą, kad spalvų derinius paverstų palyginamais santykiais. Naudodamasis šia formule, WCAG teigia, kad 4.5:1 spalvų kontrasto santykis tarp teksto ir jo fono yra pakankamas įprastam (kūno) tekstui, o didelis tekstas (18+ pt įprastas arba 14+ pt paryškintas) turėtų turėti bent 3:1 spalvų kontrasto santykį.

Pagrindinės savybės

Realaus laiko kontrasto santykio skaičiavimas
WCAG AA ir AAA atitikties tikrinimas
HSL slankikliai smulkiam derinimui
Kelių formatų peržiūra

Pažangūs įrankiai

Automatinis spalvų taisymas
Teksto ir fono pavyzdžiai
Spalvų pavadinimų atpažinimas
Rezultatų eksportavimas

Dažniausiai užduodami klausimai

WCAG AA atitikčiai įprastam tekstui reikia mažiausiai 4,5:1 kontrasto santykio, o dideliam tekstui (18pt arba 14pt paryškintas) reikia 3:1.

WCAG AAA reikalauja didesnių kontrasto santykių: 7:1 įprastam tekstui ir 4,5:1 dideliam tekstui, o AA atitinkamai 4,5:1 ir 3:1.

Naudok mūsų automatinio taisymo funkciją, kad pakeistum teksto arba fono spalvą ir išlaikytum dizaino idėją, arba spalvas koreguok rankiniu būdu su HSL slankikliais, kurių vaizdiniai indikatoriai rodo optimalias AA/AAA atitikties zonas.

Žalios zonos ir AA/AAA žymės rodo optimalius intervalus WCAG atitikčiai pasiekti. Krypties užuominos (Šviesiau/Tamsiau) padeda pasiekti geresnį kontrastą, atsižvelgiant į tavo dabartinį spalvų derinį.

Taip, gali įvesti bet kokius HEX spalvų kodus arba pasirinkti savo spalvas spalvų parinkikliu. URL atnaujinamas automatiškai, todėl gali bendrinti konkrečius spalvų derinius.