Herkes için okunabilir

Büyük bir alt başlık

Düşük kontrast en çok gövde metninde zarar verir, çünkü insanlar onu küçük boyutta ve daha uzun süre okur. Bir metin bağlantısı

Düğme

Metin rengi

Metin opaklığı

Arka plan rengi

Renk körlüğü simülasyonu

Tema

Renk kontrastı hakkında daha fazla bilgi

Renk kontrastı denetleyici

Bir tasarımı yayınlamadan önce metnin arka planında okunup okunmadığını kontrol edin. Bir metin rengi ve bir arka plan rengi seçin ya da yazın; denetleyici WCAG 2.x kontrast oranını normal metin, büyük metin ve arayüz öğeleri için AA ve AAA geçti ya da kaldı sonuçlarıyla gösterir. Canlı önizleme, renk körlüğü simülasyonu ve önerilen düzeltmeler işe yarayan bir çift bulmanıza yardımcı olur. HEX, RGB veya HSL olarak bir metin rengi ve arka plan seçin. WCAG kontrast oranı, AA ve AAA sonuçları ve önizleme siz yazarken güncellenir, geçen en yakın renkler önerilir. Her şey bu tarayıcıda kaydedilir.

Nasıl çalışır

Bir metin rengi ve bir arka plan rengi seçin ya da HEX, RGB veya HSL olarak yazın. Metin yarı saydamsa metin opaklığını ayarlayın.
Normal metin, büyük metin ve arayüz öğeleri için kontrast oranını ve AA ile AAA rozetlerini okuyun, canlı önizlemeye bakın.
Çift kalırsa önerilen bir rengi uygulayın, iyi çiftleri paletinize kaydedin ve CSS'i projenize kopyalayın.

Yalnızca puan değil, çözüm

Bir çift kaldığında denetleyici aynı ton ve doygunlukta AA ve AAA'ya ulaşan en yakın metin rengini ve arka plan rengini arar, tek tıkla uygulanır. Yarı saydam metin önce arka planla karıştırılır, tıpkı tarayıcının çizdiği gibi.

Gizli ve taşınabilir

Renkleriniz ve paletiniz yalnızca bu tarayıcıda saklanır. Yedeklemek veya başka bir cihaza taşımak için her şeyi JSON olarak kaydedin ya da sonucu PDF veya görüntü olarak kaydedin. Geri al ve yinele her değişikliği kapsar.

Sık sorulan sorular

Renk kontrastı denetleyici ücretsiz mi?

Evet. Ücretsizdir, hesap gerektirmez ve her modern tarayıcıda çalışır.

Hangi orana ihtiyacım var?

WCAG AA düzeyi normal metin için en az 4,5:1, büyük metin ve giriş kenarlıkları ile simgeler gibi arayüz öğeleri için 3:1 ister. AAA düzeyi normal metin için 7:1, büyük metin için 4,5:1 ister.

4,48 neden 4,5'e yuvarlanmasına rağmen kalıyor?

WCAG eşikleri kesindir. 4,48:1 oranı 4,5:1'in altındadır, bu yüzden normal metin için AA'yı geçemez. Denetleyici yuvarlanmamış değeri karşılaştırır, bu nedenle rozetler her zaman katıdır.