Əməliyyat

Rəng Kontrast Yoxlayıcısı

Reklam

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
Rəng kontrastı yoxlayıcımızla onları yoxlamaq və onların əlçatanlıq standartlarına uyğun olub-olmadığını dərhal görmək üçün rəng birləşmələrinizi aşağıya daxil edin.

Rəng Kontrast Yoxlayıcımız Necə İşləyir

RGB hex dəyərlərindən istifadə edərək ön plan fon rənglərinizi daxil edin və ya onları birbaşa Rəng Seçici ilə seçin.

 

  • Ön plan rənginin şəffaflığını dəyişmək üçün Alpha-ı tənzimləyin.
  • Rəngi ​​daha açıq və ya tünd göstərmək üçün Yüngüllük slayderindən istifadə edin.

Alətimiz daha sonra kontrast nisbətini hesablayır və onu WCAG təlimatlarına uyğun olaraq yoxlayır:

  • WCAG 2.0 Səviyyə AA
  • Normal əsas mətn üçün ən azı 4,5:1
  • Böyük mətn üçün ən azı 3:1
  • WCAG 2.1 (UI və qrafika)
  • Nişanlar, haşiyələr və digər interfeys komponentləri üçün ən azı 3:1
  • WCAG Səviyyə AAA
  • Normal mətn üçün ən azı 7:1
  • Böyük mətn üçün ən azı 4,5:1

Böyük mətn ya deməkdir:

  • 14 pt (təxminən 18,66 piksel) və qalın və ya
  • 18 pt (təxminən px) və ya daha böyük

Ekranınızdakı hər hansı bir şeydən dəqiq rəngləri tutmaq üçün Rəng Seçicidə göz damcısı istifadə edə bilərsiniz.

Fərqlənmək üçün yalnız rəngə əsaslanan linklər üçün onların əlçatımlılıq standartlarına cavab verdiyinə və hamı üçün asan oxuna biləcəyinə əmin olmaq üçün rəng kontrastı yoxlayıcımızdan istifadə edin.