Renk Kontrastı Denetleyicisi

Nasıl kullanılır

Renk Kontrastı Denetleyicisi nasıl kullanılır?

01
Metin rengini seçin
Ön plan rengini seçin veya yazın.
02
Arka planı seçin
Arka plan rengini seçin veya yazın.
03
Oranı oku
Kontrast oranına ve AA/AAA sonuçlarına bakın.
04
Ayarlamak
Renkleri geçinceye kadar ayarlayın.

Kullanım örnekleri

Yaygın kullanım durumları

—Kullanıcı arayüzü metninin WCAG erişilebilirliğini karşıladığını doğrulayın
—Düğmeyi ve bağlantı kontrastını kontrol edin
—Bir markanın renk paletini denetleyin
—Düşük kontrastlı pazarlama metnini düzeltin

Genel Bakış

Metninizi herkes için okunabilir hale getirin

Düşük kontrastlı metinler en yaygın erişilebilirlik hatalarından biridir. Bu denetleyici, resmi WCAG göreli parlaklık formülünü kullanarak metniniz ve arka plan renkleriniz arasındaki tam kontrast oranını hesaplar ve ardından AA'yı (normal metin için 4,5:1, büyük metin için 3:1) ve daha katı AAA'yı (7:1 ve 4,5:1) geçip geçmediğini size söyler. Canlı önizleme, seçtiğiniz renklerdeki gerçek metni gösterir.

Renkleri istediğiniz şekilde girin

Renk seçicileri kullanın veya hex kodlarını ve rgb() değerlerini doğrudan yazın; araç her ikisini de ayrıştırır. Her iki rengi de ayarladığınızda oran ve başarılı/başarısız işaretleri anında güncellenir, böylece uyumlu olana kadar bir gölgeyi dürtebilirsiniz. Her şey yerel olarak çalışır; bu da onu kullanıcı arayüzü, temalar ve pazarlama sayfaları tasarlarken hızlı bir yardımcı haline getirir.

Özellikler

01: WCAG AA ve AAA başarılı/başarısız sonuçları
02: Canlı kontrast oranı hesaplaması
03: Renk seçicilerle hex ve RGB girişi
04: Renklerinizde canlı metin önizlemesi
05: Normal ve büyük metin eşikleri
06: Tarayıcınızda yerel olarak çalışır

SSS

Sık sorulan sorular

WCAG'yi geçmek için hangi kontrast oranına ihtiyacım var?+

AA için normal metnin 4,5:1 ve büyük metnin 3:1 olması gerekir. Daha katı AAA için normal metnin 7:1 ve büyük metnin 4,5:1 olması gerekir. Büyük metin kabaca 18 punto veya 14 punto kalındır.

Kontrast oranı nasıl hesaplanır?+

Her iki renk için de WCAG bağıl parlaklık formülünü kullanır ve daha sonra açık parlaklığı (artı 0,05) koyuya (artı 0,05) bölerek 1:1 ila 21:1 arasında bir değer verir.

RGB'nin yanı sıra hex'e de girebilir miyim?+

Evet — #1e293b veya rgb(30, 41, 59) gibi onaltılık kodları yazın veya renk seçicileri kullanın. Her iki format da anında ayrıştırılır.

Ücretsiz mi?+

Evet, kayıt olmadan tamamen ücretsiz, tamamen tarayıcınızda çalışıyor.