ImageColorPicker.com

Түс контрастын тексеру

Қолжетімділікті қамтамасыз ету үшін алдыңғы және артқы фон түстерінің контраст коэффициентін тексеріңіз.

Түстеріңізді тексеріңіз

Мәтіннің оқылуын қамтамасыз ету үшін WCAG қолжетімділік стандарттарына сәйкес келетін түс комбинацияларын тексеріңіз.

5.06 1-ге
Контраст
AA
Мәтін нәтижесі
Жақсы

Салыстырылды: #FFFFFF фонда #B331C3

Мәтін

16px, Қалыпты (400)

Қалыпты мәтін ретінде саналады.

  • AA (WCAG 1.4.3): кем дегенде 4.5:1

    Өтті

  • AAA (WCAG 1.4.6): кем дегенде 7:1

    Тағы 1.94 қажет

    Сәтсіз

Пайдаланушы интерфейсі элементтері мен графика

Иконкалар, енгізу жиектері, фокус индикаторлары және интерфейсті қолдану үшін көру қажет басқа элементтер.

  • AA (WCAG 1.4.11): кем дегенде 3:1

    Өтті
5.06 1-ге. Мәтін: AA талаптарына сай келеді, AAA талаптарына сай емес. Пайдаланушы интерфейсі компоненттері: сай келеді.
Қалай тексеріледі
Салыстырылған түстер (блендингтен кейін)
Мәтін #FFFFFF, фон #B331C3
Салыстырмалы жарқырақтық
Мәтін 1.0000, фон 0.1572
Формула
(L1 + 0.05) / (L2 + 0.05) мұнда L1 жарық түстің жарқырақтығы, ал L2 қара түстің жарқырақтығы болып табылады.
Нақты қатынас
5.0674 1-ге, 5.06 1-ге деп көрсетіледі. Көрсетілген мән кесіліп көрсетіледі, дөңгелектелмейді, сондықтан ешқашан өзінен жақсы болып көрінбейді. Нақты мән талаппен салыстырылады.

Мәтін өлшемі: 16px, Қалыпты (400)

Қалыпты мәтін ретінде саналады. Үлкен мәтін кем дегенде 24px (18pt) немесе қаріп қалыңдығы 700 немесе одан жоғары болғанда кем дегенде 18.67px (14pt). Өлшемдер дөңгелектелмей, қиылып көрсетіледі.

Қалыпты мәтін ретінде саналады. Үлкен мәтін кем дегенде 24px (18pt) немесе қаріп қалыңдығы 700 немесе одан жоғары болғанда кем дегенде 18.67px (14pt). Өлшемдер дөңгелектелмей, қиылып көрсетіледі.

Aa
Алдын ала қарау тақырыбы

Жылдам қоңыр түлкі жалқау иттің үстінен секіреді

Кіші мәтін мысалы (12px)

Мәтін
#ffffff
Фон
#b331c3

WCAG стандарттары

Деңгей AA

Кәдімгі мәтін үшін 4.5:1 минималды контраст коэффициенті және үлкен мәтін үшін 3:1. Көптеген веб-сайттар үшін қажет.

Деңгей AAA

Кәдімгі мәтін үшін 7:1 жетілдірілген контраст коэффициенті және үлкен мәтін үшін 4.5:1. Оптималды қолжетімділік үшін ұсынылады.

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

Мәтін мен фон түстерінің контраст коэффициентін есептеңіз.

Мәтін мен фон түсі үшін түс таңдау құралын пайдаланып түс таңдаңыз немесе RGB он алтылық форматында түс енгізіңіз (мысалы, #259 немесе #2596BE). Түсті таңдау үшін жүгірткіні реттей аласыз. Веб-контенттің қолжетімділік нұсқаулары (WCAG) мәтіннің көру қабілеті бар пайдаланушылар үшін оқылуын анықтауға көмектесетін нақты нұсқаулыққа ие. Бұл критерий түс комбинацияларын салыстырмалы коэффициенттерге сәйкестендіру үшін белгілі бір алгоритмді пайдаланады. Осы формуланы пайдалана отырып, WCAG мәтін мен оның фонының 4.5:1 түс контраст коэффициенті кәдімгі (дене) мәтін үшін жеткілікті екенін және үлкен мәтін (18+ pt кәдімгі немесе 14+ pt қалың) кемінде 3:1 түс контраст коэффициентіне ие болуы керек екенін айтады.

Негізгі мүмкіндіктер

  • Контраст коэффициентін нақты уақытта есептеу
  • WCAG AA & AAA сәйкестігін тексеру
  • Нақтылау үшін HSL сырғытпалары
  • Көптеген алдын ала қарау форматтары

Кеңейтілген құралдар

  • Автоматты түрде түсті түзету
  • Мәтін және фон үлгілері
  • Түс атауын анықтау
  • Нәтижелерді экспорттау

Жиі қойылатын сұрақтар

WCAG AA сәйкестігі үшін қарапайым мәтінге кемінде 4,5:1 контраст коэффициенті қажет, ал ірі мәтінге (18pt немесе 14pt қою) 3:1 қажет.

WCAG AAA жоғары контраст коэффициенттерін талап етеді: қарапайым мәтінге 7:1, ірі мәтінге 4,5:1, ал AA үшін сәйкесінше 4,5:1 және 3:1.

Дизайн мақсатын сақтай отырып, мәтін немесе фон түсін реттеу үшін біздің автоматты түзету функциясын пайдаланыңыз, немесе AA/AAA сәйкестігі үшін оңтайлы аймақтарды көрсететін визуалды көрсеткіштері бар HSL жылжытқыштарымен түстерді қолмен реттеңіз.

Жасыл аймақтар мен AA/AAA белгілері WCAG сәйкестігіне жету үшін оңтайлы диапазондарды көрсетеді. Бағыттаушы кеңестер (Ашығырақ/Қараңғырақ) ағымдағы түс тіркесіміңізге қарай жақсырақ контрастқа бағыттайды.

Иә, кез келген HEX түс кодын енгізуге немесе өз түстеріңізді таңдау үшін түс таңдағышты пайдалануға болады. URL автоматты түрде жаңарады, сондықтан нақты түс тіркесімдерін бөлісе аласыз.