← Tüm araçlar

Renk kontrast kontrolü (WCAG)

Yazı ve arka plan rengini seç, kontrast oranını ve WCAG ölçütlerini anında gör. Tarayıcında çalışır, hiçbir şey sunucuya gitmez.

HEX (#3b82f6), rgb(), hsl() ya da renk adı (blue) yazabilirsin. Aşağıdaki renk kutularına tıklayınca o renk seçilir.

Açıktan koyuya tonlar

Tamamlayıcı renk

Komşu renkler

Üçlü uyum

Nasıl kullanılır?

  1. Yazı rengini ve arka plan rengini seç ya da kodlarını yaz.
  2. Kontrast oranı ve önizleme anında güncellenir.
  3. Tabloda normal metin, büyük metin ve arayüz bileşenleri için AA ve AAA ölçütlerinin geçip geçmediğini gör.

Sık sorulan sorular

Kontrast oranı nasıl hesaplanır?

Her renk için göreli parlaklık hesaplanır, ardından (açık rengin parlaklığı + 0,05) / (koyu rengin parlaklığı + 0,05) oranı bulunur. Oran 1:1 (aynı renk) ile 21:1 (siyah ve beyaz) arasındadır.

WCAG gereken oranlar nedir?

WCAG 2 AA için normal metinde en az 4,5:1, büyük metinde en az 3:1 gerekir. AAA için normal metinde 7:1, büyük metinde 4,5:1. Metin dışı arayüz bileşenleri (düğme kenarı, simge) için en az 3:1 önerilir.

Büyük metin neye denir?

WCAG'a göre en az 18 punto (yaklaşık 24 piksel) ya da kalın yazıda en az 14 punto (yaklaşık 18,7 piksel) büyüklüğündeki metin büyük sayılır.

Yarı saydam renkler nasıl hesaplanır?

Yazı rengi yarı saydamsa seçili arka planın üzerine bindirilir ve ortaya çıkan opak renk için oran hesaplanır.

İlgili rehber

İlgili araçlar