Операциялык

Түс контрастын текшерүүчү

Жарнама

Preview

Normal Text (16px)

Large Text (24px)

Contrast Ratio

21.00:1

WCAG Compliance

Normal Text

AA Pass
AAA Pass

Large Text (18pt+ or 14pt+ bold)

AA Pass
AAA Pass

UI Components & Graphics

AA Pass

WCAG Standards

Normal Text

  • AA: 4.5:1 minimum
  • AAA: 7:1 minimum

Large Text

  • AA: 3:1 minimum
  • AAA: 4.5:1 minimum

UI Components

  • AA: 3:1 minimum

Common Combinations

Black on White
White on Blue
White on Dark Gray
Биздин түстөрдүн контрастын текшергичибиз менен сынап көрүү үчүн түс айкалыштарыңызды төмөндө киргизиңиз жана алардын жеткиликтүүлүк стандарттарына жооп бергендигин дароо көрүңүз.

Биздин түстөрдүн контраст текшергичи кантип иштейт

Алдыңкы жана фон түстөрүңүздү RGB гекс маанилери менен киргизиңиз же Color Picker менен түздөн-түз тандаңыз.

 Сенин колуңдан келет:

  • Альфаны алдыңкы пландын түсү канчалык тунук болорун өзгөртүү үчүн жөндөшүңүз.
  • Lightness слайдерин колдонуп, түстү ачык же караңгы кылып көрсөтүңүз.

Андан кийин биздин курал контраст катышын эсептеп, WCAG көрсөтмөлөрү менен салыштырат:

  • WCAG 2.0 AA деңгээли
  • Кадимки негизги текст үчүн кеминде 4.5:1
  • Чоң текст үчүн кеминде 3:1
  • WCAG 2.1 (UI жана графика)
  • Иконкалар, чек аралар жана башка интерфейс компоненттери үчүн кеминде 3:1
  • WCAG AAA деңгээли
  • Нормалдуу текст үчүн кеминде 7:1
  • Чоң текст үчүн кеминде 4.5:1

Чоң текст төмөнкүлөрдү билдирет:

  • 14 pt (болжол менен 18.66 px) жана калың, же
  • 18 балл (болжол менен px) же андан да жогору

Color Pickerдеги тамчы колдонуп, экраныңыздагы каалаган нерседен так түстөрдү ала аласыз. Бул чыныгы дизайнды, баскычтарды же фонду оңой текшерүүгө шарт түзөт.

Түскө гана таянган шилтемелер үчүн, биздин түстөрдүн контраст текшергичин колдонуп, алар жеткиликтүүлүк стандарттарына жооп берип, баарына оңой окууга болот.