Renk Kontrastı Denetleyicisi
common.you_need_to_be_loggedin_to_add_tool_in_favorites
Renk kontrast denetleyicimizle test etmek için renk kombinasyonlarınızı aşağıya girin ve erişilebilirlik standartlarını karşılayıp karşılamadıklarını anında görün.
Preview
Normal Text (16px)
Large Text (24px)
Contrast Ratio
WCAG Compliance
Normal Text
Large Text (18pt+ or 14pt+ bold)
UI Components & Graphics
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
Renk Kontrastı Denetleyicimiz Nasıl Çalışır?
RGB onaltılık değerlerini kullanarak ön plan ve arka plan renklerinizi girin veya bunları doğrudan Renk Seçici ile seçin.
- Ön plan renginin şeffaflığını değiştirmek için Alfa'yi ayarlayın.
- Rengin daha açık veya daha koyu görünmesini sağlamak için Açıklık kaydırıcısını kullanın.
Aracımız daha sonra kontrast oranını hesaplar ve bunu WCAG kurallarına göre kontrol eder:
- WCAG 2.0 Düzey AA
- Normal gövde metni için en az 4,5:1
- Büyük metin için en az 3:1
- WCAG 2.1 (kullanıcı arayüzü ve grafikler)
- Simgeler, kenarlıklar ve diğer arayüz bileşenleri için en az 3:1
- WCAG Düzeyi AAA
- Normal metin için en az 7:1
- Büyük metin için en az 4,5:1
Büyük metin şu anlama gelir:
- 14 punto (yaklaşık 18,66 piksel) ve kalın veya
- 18 pt (yaklaşık piksel) veya daha büyük
Ekranınızdaki herhangi bir şeyden tam renkleri almak için Renk Seçici'deki damlalık'ı kullanabilirsiniz.
Öne çıkmak için yalnızca renge dayanan bağlantıların erişilebilirlik standartlarını karşıladığından ve herkes için kolay okunabilir olduğundan emin olmak amacıyla renk kontrastı denetleyicimizi kullanın.