Ön plan ve arka plan için HEX renkleri girin veya Pantone renkleri seçin.
Normal metin, büyük metin ve UI bileşenleri için kontrast oranını ve WCAG AA veya AAA sonuçlarını inceleyin.
Canlı önizlemeyi kullanın, renkleri değiştirin, CSS kopyalayın veya erişilebilir Pantone önerilerini deneyin.

Kontrast denetleyici kullanım alanları

Marka renk çiftlerini dijital düzenlerde kullanmadan önce doğrulayın.
Düğmeler, formlar, gezinme ve diğer UI bileşenlerinde okunabilir kontrastı kontrol edin.
Baskı renklerini ekrana uyarlamadan önce Pantone esintili paletleri karşılaştırın.
Erişilebilirlik incelemeleri ve tasarım teslimleri için WCAG kontrast sonuçlarını belgeleyin.

WCAG, UI ve Pantone iş akışları için renk kontrast denetleyici

Bir metin rengi, arka plan, düğme durumu veya marka paletinin web sitesi, uygulama, sunum ya da tasarım sistemine girmeden önce okunabilir olduğunu doğrulamanız gerektiğinde bu kontrast denetleyiciyi kullanın.

WCAG kontrast sonucunu doğru okuyun

Araç, iki rengin göreli parlaklığını hesaplar ve WCAG tarafından kullanılan kontrast oranını döndürür. Normal gövde metni genellikle AA için 4.5:1, AAA için 7:1 gerektirirken büyük metin ve temel UI bileşenleri daha düşük eşiklere sahiptir.

Pantone renkleri dijital erişilebilirlikle birleştirin

Pantone renkleri marka ve baskı çalışmaları için sık seçilir, ancak ekran karşılıklarının da erişilebilirlik açısından kontrol edilmesi gerekir. Pantone adları veya HEX değerleriyle arama yapın, çifti önizleyin ve renkleri tasarım ya da geliştirme ekiplerine aktarmadan önce erişilebilir alternatifleri karşılaştırın.

Tasarımcılar ve geliştiriciler için pratik akış

Tasarım dosyanızdaki tam HEX değerleriyle başlayın, ön plan ve arka plan yönlerini test edin, CSS veya raporu kopyalayın ve geçen renk çiftini Pantone paleti belgelerinizle birlikte saklayın.

Kontrast denetleyici SSS

Bu kontrast denetleyici ne ölçer?

Ön plan rengi ile arka plan rengi arasındaki parlaklık kontrast oranını ölçer ve sonucu WCAG eşikleriyle karşılaştırır.

WCAG AA ve AAA kontrast gereksinimleri nelerdir?

WCAG AA normal metin için en az 4.5:1, büyük metin veya UI bileşenleri için 3:1 gerektirir. WCAG AAA normal metin için 7:1, büyük metin için 4.5:1 gerektirir.

Pantone renkleri web erişilebilirliği için kontrol edilebilir mi?

Evet. Pantone referansları ekran renk değerlerine dönüştürülüp dijital kontrast açısından kontrol edilebilir. Son renkleri her zaman görünecekleri ortamda doğrulayın.

Kontrast uyarısı

Sonuçlar dijital renk değerlerinden hesaplanır ve erişilebilirlik planlaması içindir. Fiziksel baskı, malzemeler, ışık ve ekran kalibrasyonu algılanan kontrastı değiştirebilir.