Conas a dheimhním an n-éiríonn le mo chuid dathanna téacs agus cúlra le WCAG?

Cuir cóid heics isteach in Text color agus Background color, nó úsáid na roghnóirí. Taispeántar an Contrast ratio le Pass nó Fail do théacs gnáth agus mór AA agus AAA, chomh maith le comhpháirteanna comhéadain.

Cén cóimheas codarsnachta a theastaíonn le haghaidh WCAG AA?

Teastaíonn 4.5:1 ó AA do ghnáththéacs agus 3:1 do théacs mór. Teastaíonn 7:1 ó AAA do ghnáththéacs agus 4.5:1 do théacs mór. Teastaíonn 3:1 ó chomhpháirteanna comhéadain agus ó réada grafacha.

Cad a mheastar mar théacs mór?

Measann an uirlis gur téacs mór é gnáth-théacs 18pt (24px), nó téacs trom 14pt (18,66px). Caithfidh téacs níos lú na tairseacha níos airde do ghnáth-théacs a bhaint amach.

Teipeann ar mo chuid dathanna le AA. Conas is féidir liom iad a cheartú?

Bain úsáid as na moltaí aonchliceála Soláthraigh dath an téacs nó Soláthraigh cúlra. Coigeartaíonn siad gile an datha agus an lí céanna á choinneáil go dtí go mbaineann an péire 4,5:1 amach.

Cé na formáidí datha a nglactar leo, agus an féidir dath a roghnú ón scáileán?

Glactar le luachanna heics 3 dhigit agus 6 dhigit, mar shampla #abc nó #1e293b. Taispeántar cnaipe Roghnaigh dath ó scáileán i mbrabhsálaithe a thacaíonn leis an EyeDropper API, ar nós Chromium.

An bhfuil sé saor in aisce i ndáiríre?

Is ea. Tá gach uirlis saor in aisce le húsáid, gan cuntas agus gan cárta creidmheasa. Déantar an obair ar do ghléas féin seachas ar ár bhfreastalaithe, rud a ligeann dúinn é a choinneáil saor in aisce.

An oibríonn sé ar shoghluaiste?

Tá. Ritheann sé i mbrabhsálaithe soghluaiste reatha ar iOS agus ar Android, gan aon rud le suiteáil.

🌓

Seiceálaí Codarsnachta Dathanna WCAG saor in aisce

Seiceáil cé acu a chomhlíonann dhá dháta caighdeáin chodarsnachta WCAG AA agus AAA le haghaidh inrochtaineachta. Réamhamharc beo ag méideanna téacs iolracha le moltaí uathoibríocha nuair a bhíonn an chodarsnacht rómhíseal.

Ritheann i do bhrabhsálaíGan clárú, gan preabfhuinneogaNíl gá le logáil isteachSaor in aisce go deo

Oibríonn as líne nuair a lódáiltear é

Dath téacs

Dath cúlra

Téacs ceannteidil mhóir

Téacs príomhábhair meánach (18px) le haghaidh léitheoireachta agus ábhair.

Gnáthtéacs príomhábhair (16px) le haghaidh ailt.

Téacs príomhábhair beag (14px) le haghaidh fotheideal agus meiteashonraí.

14.63:1

Cóimheas codarsnachta

✓WCAG AA — Gnáthtéacs

Éilítear 4.5:1 · Tá 14.63:1 agat

✓WCAG AA — Téacs mór

Éilítear 3.0:1 · Tá 14.63:1 agat

✓WCAG AAA — Gnáthtéacs

Éilítear 7.0:1 · Tá 14.63:1 agat

✓WCAG AAA — Téacs mór

Éilítear 4.5:1 · Tá 14.63:1 agat

✓Comhpháirteanna UI / réada grafacha

Éilítear 3.0:1 · Tá 14.63:1 agat

Réamhshocruithe tapa

Bunaithe ar threoirlínte codarsnachta WCAG 2.1. Téacs mór = 18pt (24px) gnách nó 14pt (18.66px) trom. Nuashonraítear cóid hex sa dá threo: clóscríobh hex nó roghnaigh dath, fanann an dá ionchur sioncronaithe.

Úsáidí coitianta

Audit Leathanaigh Gréasáin do WCAG RéiteachDearbhaigh na dathanna líostaigh do suíomh réitigh WCAG AA nó AAA dhíospóid shonrú ar gach rochtain.
Dearbhaigh Branda Dath ComhcheangalTurgnamh do dath branda paleannú bairdí a dhéanann ar gach soiléir UI dearadh.
Test Dorchadh Solais Dath PaleannúSoilsiú téacs ar gheal-dorcha an fhéadfaidh go fóill a shéala ar dhíospóid - féach ar do dorchad paleannú bairde anseo.
Dath Par do Gréine MhaisithePhóstaeir, comharthaí, agus ábhar priontáil bhraithim go léir díospóid léasuithe - go háirithe d'aoshur breathnóirí.
Dearc a Dhíonna Button IniúchtaCinntigh go bhfuil CTAs, cnaipeanna gníomhaíochta, agus naisc ag foluain ar WCAG i gcoinne a gcúlra.

Conas a Oibríonn sé

Ritheann seiceáil chodarsnachta go hiomlán i do bhrabhsálaí ag baint úsáide as algartam soilseachta coibhneasta WCAG 2.1 — gan leabharlann, gan freastalaí, ach matamaitic lámhscríofa a leanann an sonraíocht go beacht. Nuashonraítear gach toradh i bhfíor-am agus tú ag clóscríobh nó ag roghnú datha.

1
Ionchur heics agus normalú
Glactar le luachanna heics 3-digit (#abc) agus 6-digit (#aabbcc) araon agus normáiltear go trípléid RGB iomlána iad. Diúltaítear d'ionchur neamhbhailí láithreach seachas dul chuig dubh go ciúin, mar sin taispeántar teorainn dhearg in ionad toradh pas mealltach.
2
Ríomh soilseachta WCAG
Tiontaítear gach dath go soilseacht choibhneasta ag baint úsáide as foirmle WCAG 2.1: déantar cainéil sRGB a líneáradh le ceartúchán gama pícechiallach (á roinnt ar 12.92 faoi bhun 0.03928, á ardú go dtí cumhacht 2.4 os a chionn), ansin ualaítear iad mar 0.2126R + 0.7152G + 0.0722B.
3
Cóimheas codarsnachta agus seiceálacha comhlíonta
Ríomhtar an cóimheas codarsnachta mar (níos gile + 0.05) / (níos duibhe + 0.05) agus seiceáiltear é i gcoinne an chúig thairseach WCAG go léir: gnáth-théacs AA (4.5:1), téacs mór AA (3:1), gnáth-théacs AAA (7:1), téacs mór AAA (4.5:1), agus comhpháirteanna Ú (3:1). Nuashonraítear torthaí ar gach buille eochrach.
4
Moltaí ceartaithe a chaomhnaíonn tuar
Nuair a theipeann ar an bpéire WCAG AA, cuardaíonn an t-uirlis spás gile HSL — ag céimniú amach ón ngile bhunaidh sa dá threo — chun an leagan is gaire de gach dath a aimsíonn a théann thar 4.5:1 agus an tuar agus sáithiú céanna á gcoinneáil. Tá an API EyeDropper (Chromium) ar fáil freisin chun aon dath a shampláil go díreach ó do scáileán.

Uirlisí Gaolmhara

👁️

Insamhlóir Daille Dathanna

Féach cén chuma atá ar do dhearadh do dhaoine le easnaimh físe dathanna. Insamhlaíonn prótatóipía, deotarópía, trítanópía, acrómatóipsia, agus neamhghnáthachtaí níos éadroime.

Bain triail asFanann comhaid go háitiúil

📐

Cad É Réiteach Mo Scáileáin

Feic taifeach do scáileáin i bpicteilíní CSS agus fíorphicteilíní, méid na fuinneoige, cóimheas picteilíní, doimhneacht datha, HDR, tacaíocht tadhaill agus ráta athnuachana, agus cóipeáil é ar fad.

Bain triail as

🖥️

Tástáil Picteilíní Marbha

Seiceáil do scáileán le haghaidh picteilíní marbha nó greamaithe le dubh, bán, dearg, glas, gorm agus liath lánscáileáin, móide deisitheoir picteilíní greamaithe roghnach.