Hvernig athuga ég hvort texta- og bakgrunnslitir mínir standist WCAG?

Sláðu inn hex-kóða í Textalitur og Bakgrunnslitur, eða notaðu litaveljarana. Birtuskilahlutfallið birtist með Stenst eða Stenst ekki fyrir AA og AAA fyrir venjulegan og stóran texta, auk viðmótshluta.

Hvaða birtuskilaskilyrði setur WCAG AA?

AA krefst 4,5:1 fyrir venjulegan texta og 3:1 fyrir stóran texta. AAA krefst 7:1 fyrir venjulegan texta og 4,5:1 fyrir stóran texta. Viðmótshlutir og myndrænir hlutir krefjast 3:1.

Hvað telst vera stór texti?

Tólið skilgreinir 18 pt (24 px) venjulegan texta eða 14 pt (18,66 px) feitletraðan texta sem stóran texta. Minni texti verður að uppfylla hærri kröfurnar fyrir venjulegan texta.

Litirnir mínir ná ekki AA-kröfum. Hvernig laga ég það?

Notaðu tillögurnar Laga textalitur eða Laga bakgrunn með einum smelli. Þær stilla birtustig en halda sama litblæ þar til parið nær 4,5:1.

Hvaða litasnið eru studd og get ég valið lit af skjánum?

Tólið tekur við 3 og 6 stafa hex-gildum, svo sem #abc eða #1e293b. Hnappurinn Velja lit frá skjánum birtist í vöfrum sem styðja EyeDropper API, eins og Chromium.

Er þetta í alvöru ókeypis?

Já. Öll verkfæri eru ókeypis í notkun, án aðgangs og án kreditkorts. Vinnan fer fram í tækinu þínu frekar en á netþjónum okkar, sem gerir það að verkum að hægt er að halda þjónustunni ókeypis.

Virkar það í farsíma?

Já. Það keyrir í nýlegum farsímavöfrum á iOS og Android án þess að setja neitt upp.

🌓

WCAG-litasamdráttskoðari — ókeypis

Athugaðu hvort tveir litir uppfylli WCAG AA og AAA samdráttsstaðla fyrir aðgengi. Bein forskoðun í mörgum leturstærðum með sjálfvirkum tillögum þegar samdráttinn er of lítill.

Keyrir í vafranum þínumEngin skráning, engir sprettigluggarEngin innskráning krafistFrjáls að eilífu

Virkar án nettengingar eftir hleðslu

Textalitur

Bakgrunnslitur

Stór fyrirsögn

Meðalstór meginmálstexti (18px) til lestrar.

Venjulegur meginmálstexti (16px) fyrir málsgreinar.

Lítill meginmálstexti (14px) fyrir myndatexta og lýsigögn.

14,63:1

Sniðgildi

✓WCAG AA — venjulegur texti

Krefst 4.5:1 · Þú ert með 14,63:1

✓WCAG AA — stór texti

Krefst 3.0:1 · Þú ert með 14,63:1

✓WCAG AAA — venjulegur texti

Krefst 7.0:1 · Þú ert með 14,63:1

✓WCAG AAA — stór texti

Krefst 4.5:1 · Þú ert með 14,63:1

✓UI-íhlutir / grafísk hlutir

Krefst 3.0:1 · Þú ert með 14,63:1

Skjótar forstillingar

Byggt á WCAG 2.1 leiðbeiningum um sniðgildi. Stór texti = 18pt (24px) venjulegur eða 14pt (18,66px) feitletraður. HEX-kóðar uppfærast í báðar áttir: sláðu inn HEX eða veldu lit, bæði inntök haldast samstillt.

Algeng notkun

Endurskoðaðu vefsíðu fyrir WCAG samræmiSannreyndu litunum þínum vefsíðu uppfylla WCAG AA eða AAA andstæðu staðla fyrir aðgengi.
Sannaðu vörumerki litir samsetningPrófaðu vörumerki litir pöll par til að tryggja að þau virka fyrir aðgengilega UI hönnun.
Prófaðu dökk ham litir pöllLjósliti á dökka bakgrunn getur samt ekki andstæða - athugaðu þína dökk ham pöll par hér.
Litir par fyrir prentun efniPlótur, skilti og prentuð efni þurfa einnig læsileg andstæða - sérstaklega fyrir eldri áhorfendur.
Hannaðu aðgengilega hnappalitGakktu úr skugga um að CTA, aðgerðarhnappar og tenglar standist WCAG á móti bakgrunni þeirra.

Hvernig það virkar

Kontrastprófun keyrir alfarið í vafranum þínum með WCAG 2.1 hlutfallslegu birtu-reikniritinu — ekkert bókasafn, enginn netþjónn, aðeins handskrifuð stærðfræði sem fylgir forskriftinni nákvæmlega. Sérhver niðurstaða uppfærist í rauntíma þegar þú skrifar eða velur lit.

1
Hex-inntak og normalisering
Bæði 3-stafa (#abc) og 6-stafa (#aabbcc) hexgildi eru tekin við og normaliseruð í fulla RGB-þríliða. Ógilt inntak er hafnað strax frekar en að falla þegjandi í svart, svo rauður jaðar birtist í stað villandi lokinnar niðurstöðu.
2
WCAG birtuútreikningur
Hver litur er breyttur í hlutfallslega birtu með WCAG 2.1 formúlunni: sRGB-rásgildi eru línulögð með stykkjóttri gammaleiðréttingu (deilt með 12,92 undir 0,03928, hafið upp í 2,4 fyrir ofan), vegin svo sem 0,2126R + 0,7152G + 0,0722B.
3
Kontrasthlutfall og samræmisathugun
Kontrasthlutfallið er reiknað sem (ljósari + 0,05) / (dekkri + 0,05) og athugað gegn öllum fimm WCAG-þröskuldum: AA venjulegur texti (4,5:1), AA stór texti (3:1), AAA venjulegur texti (7:1), AAA stór texti (4,5:1), og UI-hlutar (3:1). Niðurstöður uppfærast við hvert lykilslag.
4
Blæ-varðveitandi lagfæringartillögur
Þegar parið stenst ekki WCAG AA leitar tólið í HSL-birtusvæði — skref út frá upprunalegu birtunni í báðar áttir — til að finna næsta afbrigði hvers litar sem stenst 4,5:1 á meðan sami blær og mettun er haldið. EyeDropper API (Chromium) er einnig í boði til að sýna hvaða lit sem er beint af skjánum þínum.

Tengd verkfæri

👁️

Litblinduhermun

Sjáðu hvernig hönnunin þín lítur út fyrir fólk með litaskynsbilanir. Hermir eftir protanopíu, deuteranopíu, tritanopíu, achromatsíu og vægari afbrigðum.

Prófaðu þaðSkrár eru staðbundnar

📐

Hver er skjáupplausnin mín

Sjáðu skjáupplausn þína í CSS- og raunpunktum, gluggastærð, punktahlutfall, litadýpt, HDR, snertistuðning og endurnýjunartíðni, og afritaðu allt saman.

Prófaðu það

🖥️

Dauð punkta prófun

Athugaðu hvort dauðir eða fastir punktar leynast á skjánum með svörtum, hvítum, rauðum, grænum, bláum og gráum heilskjá, ásamt valfrjálsu verkfæri til að losa fasta punkta.