Renk Kontrast Denetleyicisi
Normal ve büyük metin için AA ve AAA geçer/kalır rozetleriyle WCAG kontrast oranını kontrol etmek için bir ön plan ve arka plan rengi girin.
Pijamalı hasta yağız şoföre çabucak güvendi.
Pijamalı hasta yağız şoföre çabucak güvendi.
Nasıl Çalışır
Renk kontrast denetleyicisi, dünya genelindeki kuruluşlar tarafından kullanılan erişilebilirlik standardı olan WCAG 2.1 yönergelerine uygun olarak metin rengi ile arka plan rengi arasındaki parlaklık kontrast oranını ölçer.
Metin ve arka plan rengini HEX, RGB veya HSL formatında girin. Araç her rengin göreli parlaklığını ve kontrast oranlarını anında hesaplar.
Sonuçlar WCAG seviyelerine göre test edilir: AA, normal metin için ≥4,5:1 ve büyük metin için ≥3:1 gerektirir; AAA ≥7:1 ve ≥4,5:1 gerektirir. Görsel önizleme, metnin o arka planda gerçekte nasıl göründüğünü gösterir.
Düşük kontrast, görme bozukluğu olan kullanıcılar için içeriği okumayı zorlaştırır; özellikle renk körlüğü olanlar için.
Uygulamalı Örnek
Beyaz zeminde #767676 gri metni kontrol edin: kontrast oranı tam 4,54:1’dir — normal metin için WCAG AA’yı geçer (4,5:1 ister) ama AAA’da (7:1) kalır; sonuç kartları büyük metnin gevşetilmiş kuralları dahil her eşiği ayrı gösterir. Logaritmik ölçek çubuğu, çiftin 1:1 ile saf siyah-beyazın 21:1’i arasında nerede durduğunu gösterir. APCA kartı WCAG 3 ölçütünün önizlemesini sunar; değiştir düğmesi ön planla arka planı ters çevirmenin işe yarayıp yaramadığını anında yanıtlar. Canlı önizleme gerçek metin çizer, kendi gözlerinizle yargılarsınız.
Kullanım Alanları
- Bir web sitesi yeniden tasarımını başlatmadan önce marka renk paletini erişilebilirlik uyumluluğu için kontrol etme
- Koyu veya açık temada okunabilir kalan düğme ve bağlantı renkleri seçme
- Section 508, EN 301 549 veya ADA uyumluluğu için WCAG 2.1 AA veya AAA gereksinimlerini karşılama
- Geliştirme başlamadan önce okunamayan metni işaretlemek için tasarımcıdan gelen bir maketi gözden geçirme
- Küçük parlaklık farklarının nasıl büyük kontrast arızalarına yol açtığını göstererek erişilebilirlik kavramlarını öğretme
Sıkça Sorulan Sorular
- WCAG nedir?
- Web İçeriği Erişilebilirlik Yönergeleri — W3C tarafından yayınlanan, yasal olarak giderek daha fazla zorunlu tutulan erişilebilirlik standartları.
- Hangi minimum kontrastı hedeflemeliyim?
- Çoğu site için minimum AA (normal metin için 4,5:1); kritik içerik için AAA.
- Büyük metin farklı gereksinimlere sahip mi?
- Evet — ≥18pt veya ≥14pt kalın metin yalnızca 3:1 (AA) veya 4,5:1 (AAA) gerektirir.
- Denetleyici renk körlüğünü hesaba katlıyor mu?
- Parlaklık sonucu, en yaygın renk körlüğü türlerini doğal olarak kapsayan algı matematiğine dayanır.
- Doğrudan HEX kodu yapıştırabilir miyim?
- Evet, #RRGGBB veya sadece RRGGBB yapıştırın — araç her iki formatı da kabul eder.