Kontrolluesi i kontrastit të ngjyrave

Kontrollo ngjyrat e tua

Testo kombinimet e ngjyrave për të siguruar që ato plotësojnë standardet e aksesueshmërisë WCAG për lexueshmërinë e tekstit.

Kontrast

AAA

Rezultati i tekstit

Super

Krahasuar: #000000 në #FBFBF9

Tekst

16px, Regular (400)

Llogaritet si tekst normal.

AA (WCAG 1.4.3): të paktën 4.5:1
Kalon
AAA (WCAG 1.4.6): të paktën 7:1
Kalon

Komponentë UI dhe grafikë

Ikona, kufijtë e inputeve, treguesit e fokusit dhe pjesë të tjera që duhet t'i shohësh për të përdorur ndërfaqen.

AA (WCAG 1.4.11): të paktën 3:1
Kalon

Si verifikohet kjo

Ngjyrat e krahasuara (pas përzierjes): Tekst #000000 në sfond #FBFBF9
Luminanca relative: Tekst 0.0000, sfond 0.9634
Formula: (L1 + 0.05) / (L2 + 0.05) ku L1 është luminanca e ngjyrës më të ndritshme dhe L2 e asaj më të errët.
Raporti i saktë: 20.2686 ndaj 1, shfaqet si 20.26 ndaj 1. Vlera e shfaqur pritet, nuk rrumbullohet, prandaj nuk duket kurrë më mirë se ç'është. Vlera e saktë është ajo që krahasohet me kërkesën.

Madhësia e tekstit: 16px, Regular (400)

Llogaritet si tekst normal. Teksti i madh është të paktën 24px (18pt), ose të paktën 18.67px (14pt) kur është bold (pesha 700 ose më shumë). Madhësitë shfaqen të prera, jo të rrumbullakosura.

Kriteret

Ngjyra e Tekstit

Ngjyra e Sfondit

Madhësia e tekstit (px)

Pesha e shkronjave

Titulli i paraqitjes

Dhelpra e shpejtë kafe kërcen mbi qenin dembel

Shembull teksti i vogël (12px)

Teksti

#000000

Sfondi

#fbfbf9

Standardet WCAG

Niveli AA

Raporti minimal i kontrastit të 4.5:1 për tekstin normal dhe 3:1 për tekstin e madh. Kërkohet për shumicën e faqeve.

Niveli AAA

Raporti i avancuar i kontrastit prej 7:1 për tekstin normal dhe 4.5:1 për tekstin e madh. Rekomandohet për aksesibilitet optimal.

Llogarit raportin e kontrastit të tekstit dhe ngjyrave të sfondit.

Zgjidh një ngjyrë duke përdorur përzgjedhësin e ngjyrave për tekstin dhe ngjyrën e sfondit ose fut një ngjyrë në formatin hexadecimal RGB (p.sh., #259 ose #2596BE). Mund të rregullosh lëvizësin për të zgjedhur ngjyrën. Udhëzimet për Përmbajtjen në Ueb (WCAG) ka një udhëzim specifik për të ndihmuar në përcaktimin nëse teksti është i lexueshëm për përdoruesit me pamje. Kjo kriter përdor një algoritëm të caktuar për të hartuar kombinime ngjyrash në raporte të krahasueshme. Duke përdorur këtë formulë, WCAG deklaron se një raport kontrasti 4.5:1 me tekstin dhe sfondin e tij është adekuat për tekstin e zakonshëm (trupi), dhe tekstet e mëdha (18+ pt normale, ose 14+ pt të trasha) duhet të kenë të paktën një raport kontrasti 3:1.

Karakteristikat kryesore

Llogaritja e raportit të kontrastit në kohë reale
Kontrolli i përputhshmërisë WCAG AA & AAA
Rrëshqitësit HSL për rregullim të hollësishëm
Formate të shumta parapamjeje

Mjete të avancuara

Rregullim automatik i ngjyrave
Shembuj të tekstit dhe sfondit
Zbulimi i emrit të ngjyrës
Eksporto rezultatet

Pyetjet e shpeshta

Për përputhshmërinë WCAG AA, teksti normal kërkon një raport minimal kontrasti prej 4,5:1, ndërsa teksti i madh (18pt ose 14pt i trashë) kërkon 3:1.

WCAG AAA kërkon raporte më të larta kontrasti: 7:1 për tekstin normal dhe 4,5:1 për tekstin e madh, krahasuar me 4,5:1 dhe 3:1 të AA.

Përdor veçorinë tonë të korrigjimit automatik për të rregulluar ngjyrën e tekstit ose të sfondit duke ruajtur qëllimin e dizajnit, ose rregullo ngjyrat manualisht me rrëshqitësit HSL dhe tregues vizualë që tregojnë zonat optimale për përputhshmërinë AA/AAA.

Zonat e gjelbra dhe shenjuesit AA/AAA tregojnë intervalet optimale për të arritur përputhshmërinë WCAG. Udhëzimet e drejtimit (më të çelët/më të errët) të ndihmojnë të arrish kontrast më të mirë sipas kombinimit aktual të ngjyrave.

Po, mund të fusësh çdo kod ngjyre hex ose të përdorësh zgjedhësin e ngjyrave për të zgjedhur ngjyra të personalizuara. URL përditësohet automatikisht, në mënyrë që të mund të ndash kombinime të caktuara ngjyrash.