Rəng kontrast yoxlayıcısı

Əlçatanlığı təmin etmək üçün ön plan və fon rəngləri arasındakı kontrast nisbətini sınaqdan keçir.

Rənglərini yoxla

Mətn oxunaqlığı üçün WCAG əlçatanlıq standartlarına cavab verdiyinə əmin olmaq üçün rəng kombinasiyalarını sınaqdan keçir.

6.18 1-ə nisbətən
Kontrast
AA
Mətn nəticəsi
Yaxşı

Müqayisə: #000000 üzərində #2596BE

Mətn

16px, Normal (400)

Normal mətn sayılır.

  • AA (WCAG 1.4.3): ən azı 4.5:1

    Keçdi
  • AAA (WCAG 1.4.6): ən azı 7:1

    0.82 daha lazımdır

    Uğursuz

İstifadəçi interfeysi komponentləri və qrafika

İkonlar, input kənarları, fokus indikatorları və interfeysdən istifadə etmək üçün görməli olduğun digər hissələr.

  • AA (WCAG 1.4.11): ən azı 3:1

    Keçdi
Nisbət 6.18:1. Mətn: AA səviyyəsini keçdi, AAA səviyyəsini keçmədi. İstifadəçi interfeysi komponentləri: keçdi.
Necə yoxlanılır
Müqayisə olunan rənglər (qarışdırıldıqdan sonra)
Mətn #000000, fon #2596BE
Nisbi parlaqlıq
Mətn 0.0000, fon 0.2592
Formula
(L1 + 0.05) / (L2 + 0.05) burada L1 açıq rəngin parlaqlığı, L2 isə tünd rəngin parlaqlığıdır.
Dəqiq nisbət
6.1847:1, 6.18:1 kimi göstərilir. Göstərilən dəyər kəsilir, yuvarlaqlaşdırılmır, yəni həmişə olduğundan daha yaxşı görünmür. Dəqiq dəyər tələb ilə müqayisə edilən dəyərdir.

Mətn ölçüsü: 16px, Normal (400)

Normal mətn sayılır. Böyük mətn ən azı 24px (18pt) olmalıdır, və ya qalın olduqda (700 və ya daha çox) ən azı 18.67px (14pt). Ölçülər yuvarlaqlaşdırılmır, kəsilmiş şəkildə göstərilir.

Normal mətn sayılır. Böyük mətn ən azı 24px (18pt) olmalıdır, və ya qalın olduqda (700 və ya daha çox) ən azı 18.67px (14pt). Ölçülər yuvarlaqlaşdırılmır, kəsilmiş şəkildə göstərilir.

Aa
Önizləmə başlığı

Cəld qəhvəyi tülkü tənbəl it üzərindən atlanır

Kiçik mətn nümunəsi (12px)

Mətn
#000000
Fon
#2596be

WCAG Standartları

Səviyyə AA

Adi mətn üçün minimum 4.5:1 və böyük mətn üçün 3:1 kontrast nisbəti. Əksər veb saytlar üçün tələb olunur.

Səviyyə AAA

Adi mətn üçün 7:1 və böyük mətn üçün 4.5:1 təkmilləşdirilmiş kontrast nisbəti. Optimal əlçatanlıq üçün tövsiyə olunur.

Rəng kontrast yoxlayıcısı

Mətn və fon rənglərinin kontrast nisbətini hesabla.

Mətn və fon rəngi üçün rəng seçmək üçün rəng seçicisini istifadə et və ya RGB onaltılıq formatında rəng daxil et (məsələn, #259 və ya #2596BE). Rəng seçmək üçün sürgünü tənzimləyə bilərsən. Veb Məzmunu Əlçatanlıq Təlimatları (WCAG) mətnin görmə qabiliyyətli istifadəçilər üçün oxunaqlı olub-olmadığını müəyyənləşdirmək üçün xüsusi təlimatlara malikdir. Bu meyar rəng kombinasiyalarını müqayisə edilə bilən nisbətlərə çevirmək üçün xüsusi bir alqoritmdən istifadə edir. Bu formuladan istifadə edərək, WCAG bildirir ki, mətn və onun fonu ilə 4.5:1 rəng kontrast nisbəti adi (bədən) mətn üçün kifayətdir və böyük mətn (18+ pt adi və ya 14+ pt qalın) ən azı 3:1 rəng kontrast nisbətinə malik olmalıdır.

Əsas xüsusiyyətlər

  • Real vaxtda kontrast nisbətinin hesablanması
  • WCAG AA & AAA uyğunluq yoxlaması
  • Dəqiq tənzimləmə üçün HSL sürgüləri
  • Çoxsaylı önizləmə formatları

İnkişaf etmiş alətlər

  • Avtomatik rəng düzəltmə
  • Mətn və fon nümunələri
  • Rəng adının aşkarlanması
  • Nəticələri ixrac et

Tez-tez verilən suallar

WCAG AA uyğunluğu üçün adi mətn ən azı 4,5:1 kontrast nisbəti tələb edir, iri mətn (18pt və ya 14pt qalın) isə 3:1 tələb edir.

WCAG AAA daha yüksək kontrast nisbətləri tələb edir: adi mətn üçün 7:1, iri mətn üçün 4,5:1. AA üçün müvafiq olaraq 4,5:1 və 3:1-dir.

Dizayn məqsədini saxlayaraq mətn və ya fon rənglərini tənzimləmək üçün avtomatik düzəliş funksiyamızdan istifadə et, ya da AA/AAA uyğunluğu üçün optimal zonaları göstərən vizual göstəriciləri olan HSL sürgüləri ilə rəngləri əl ilə tənzimlə.

Yaşıl zonalar və AA/AAA işarələri WCAG uyğunluğuna çatmaq üçün optimal diapazonları göstərir. İstiqamət işarələri (Daha açıq/Daha tünd) cari rəng kombinasiyasına əsasən daha yaxşı kontrasta doğru səni istiqamətləndirir.

Bəli, istənilən HEX rəng kodunu daxil edə və ya özəl rənglər seçmək üçün rəng seçicidən istifadə edə bilərsən. URL avtomatik yenilənir, beləliklə müəyyən rəng kombinasiyalarını paylaşa bilərsən.