Araç, resmi WCAG göreli parlaklık formülünü kullanır; dolayısıyla hesaplanan değerler WebAIM denetleyicisi ve çoğu erişilebilirlik denetimiyle örtüşür. Her şey tarayıcınızda çalışır - renkleriniz hiçbir sunucuya yüklenmez ve herhangi bir limit yoktur.
Renk Kontrastı Kontrolü
Tümüyle tarayıcınızda çalışır - yükleme yok, üyelik yok.
Kontrast oranı
Geçergerekli 4.5:1
Geçergerekli 3:1
Geçemezgerekli 7:1
Geçergerekli 4.5:1
Büyük = 18pt (24px) ya da 14pt (18,66px) kalın.
Renk kontrastı kontrolü nedir?
Renk kontrastı kontrolü, bir metin rengi ile arka plan rengi arasındaki kontrast oranını ölçerek WCAG erişilebilirlik standartlarını karşılayıp karşılamadığını gösterir. Sonuç 1:1 ile 21:1 arasında bir oranla ifade edilir; ardından normal ve büyük metin boyutları için AA ve AAA düzeylerinde geçer ya da kalır şeklinde değerlendirme yapılır.
Nasıl kullanılır
- 1Renkleri girin. Metin ve arka plan için bir hex kodu, rgb() değeri ya da CSS renk adı yazın; isterseniz renk seçiciyi kullanın.
- 2Oranı okuyun. Kontrast oranı anında güncellenir; seçtiğiniz renklerde metnin nasıl göründüğünü de önizleyebilirsiniz.
- 3Rozetleri kontrol edin. Her rozet, normal ve büyük metin boyutları için WCAG AA ve AAA kriterlerine göre geçer ya da kalır sonucunu gösterir.
Kimler için
- Tasarımcılar, marka renklerini geliştirme aşamasına taşımadan önce test eder.
- Ön uç geliştiriciler, buton, bağlantı ve etiket renklerini WCAG AA kriterlerine göre denetler.
- Erişilebilirlik denetçileri, kontrast hatalarını tam oranlarıyla belgelemek için kullanır.
- İçerik ve e-posta ekipleri, renkli arka planlarda metnin okunabilir kalıp kalmadığını doğrular.
Sık sorulan sorular
Renk kontrastı kontrolü ücretsiz mi?
Evet - yüzde yüz ücretsiz, üyelik gerektirmez ve sınır yoktur. Tarayıcınızda çalışır.
WCAG AA için kontrast oranı kaç olmalı?
WCAG 2.1 Seviye AA, normal metin için en az 4,5:1 ve büyük metin için 3:1 kontrast oranı gerektirir. AAA seviyesi bu eşikleri normal metin için 7:1 ve büyük metin için 4,5:1 olarak yükseltir.
Büyük metin nedir?
Büyük metin; normal ağırlıkta en az 18pt (yaklaşık 24px) ya da kalın biçimde 14pt (yaklaşık 18,66px) ve üzerindeki metindir. Daha büyük harfler okunması daha kolay olduğu için büyük metne daha düşük bir kontrast oranı uygulanır.
Renk kontrastı nasıl hesaplanır?
Formül (L1 + 0,05) / (L2 + 0,05) şeklindedir; burada L1 ve L2, açık ve koyu renklerin göreli parlaklık değerleridir. Parlaklık, WCAG 2.x tanımına göre sRGB kırmızı, yeşil ve mavi kanallarından hesaplanır.
Hex, RGB ve renk adlarını destekliyor mu?
Evet. 3, 4, 6 ya da 8 haneli hex, rgb() ve rgba() değerleri ile 'teal' gibi CSS renk adları girilebilir. Renk seçiciyle de doğrudan seçim yapabilirsiniz.
Aynı oran neden bazen geçiyor bazen geçemiyor?
Gereken oran, metin boyutuna ve hedeflenen WCAG seviyesine göre değişir. 3,5:1 oranı normal metin için AA'yı geçemezken büyük metin için geçer; bu yüzden her zaman gerçekte kullandığınız boyut ve seviyeye göre kontrol edin.