CSS Araçları

Renk Contrast Checker

WCAG 2.1 standartlarına göre iki renk arasındaki kontrast oranını hesaplayın. AA ve AAA erişilebilirlik seviyelerini kontrol edin.

Kontrast Kontrolü
Örnek Başlık Metni
Bu metin seçtiğiniz renk kombinasyonuyla görünecektir. WCAG uyumluluğu burada kontrol edilir.
Yazı Rengi (Foreground)
Arka Plan Rengi (Background)
17.06:1
Mükemmel
Tüm WCAG seviyelerini geçiyor
AA Normal Metin
Minimum 4.5:1
Geçti
AA Büyük Metin
Minimum 3:1
Geçti
AAA Normal Metin
Minimum 7:1
Geçti
AAA Büyük Metin
Minimum 4.5:1
Geçti
AA UI Bileşeni
Minimum 3:1
Geçti

Renk Kontrastı Neden Önemli?

Yeterli renk kontrastı, özellikle görme bozukluğu olan kullanıcılar için web erişilebilirliğinin temel gereksinimlerinden biridir. WCAG (Web Content Accessibility Guidelines) standartları, metin ve arka plan arasında minimum kontrast oranları belirler.

WCAG Seviyeleri

AA Normal Metin: 4.5:1 minimum kontrast oranı gerekir. 18px altındaki metinler için geçerlidir.

AA Büyük Metin: 3:1 minimum kontrast oranı. 18px üstü veya 14px bold metinler için geçerlidir.

AAA Normal Metin: 7:1 minimum kontrast oranı. En yüksek erişilebilirlik seviyesi.

AAA Büyük Metin: 4.5:1 minimum kontrast oranı. Büyük metin için AAA seviyesi.

Sıkça Sorulan Sorular

AA ve AAA arasındaki fark nedir?

AA minimum erişilebilirlik standardıdır ve çoğu web sitesi için yeterlidir. AAA en yüksek seviyedir ve daha sıkı kontrast gereksinimleri uygular.

Kontrast oranı nasıl hesaplanır?

WCAG 2.1 formülüne göre, iki rengin göreceli parlaklık (luminance) değerleri kullanılarak hesaplanır. Oran 1:1 (aynı renk) ile 21:1 (siyah-beyaz) arasında değişir.