WCAG Renk Kontrast Denetleyicisi

WCAG 2.1 yönergelerine göre metin ve arka plan renklerinin kontrast oranını değerlendirin. Erişilebilir renk ayarlamalarını anında oluşturun.

HEX/RGB/HSL
HEX/RGB/HSL
Her şey tarayıcınızda yerel olarak çalışır.

Canlı Metin Önizlemesi

Büyük Başlık (18pt Kalın / 24pt Normal)

Bu, büyük başlık metin tarzının bir önizlemesidir.

Normal Metin (18pt Altı)

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Kontrast Oranı

18.6:1

WCAG 2.1 Uyumluluk Durumu

WCAG AA Gereksinimleri
Normal Metin (4.5:1) PASS
Büyük Metin (3.0:1) PASS
WCAG AAA Gereksinimleri
Normal Metin (7.0:1) PASS
Büyük Metin (4.5:1) PASS

WCAG 2.1 Yönergeleri

Bölüm 508, ADA ve WCAG AA veya AAA yönergelerine uygun erişilebilir arayüzler oluşturmak için kontrast standartlarını kolayca doğrulayın.

Öneri Motoru

HSL koordinatları boyunca renklerinizi otomatik olarak ayarlayın ve kontrast oran kriterlerini karşılayan en yakın alternatifleri bulabilirsiniz.

Tamamen İstemci Tarafı

Hesaplamalar tarayıcınızın bağlamında yerel olarak yürütülür. Sunucularımıza hiçbir renk, dosya veya telemetri koordinatı iletilmez.

İlgili Renk Araçları

HEX RGB HSL Renk Dönüştürücü
Renkleri dönüştürün ve açıklık koordinatlarını ayarlayın.
Görsel Renk Seçici
Tasarım maketlerinden renk paletlerini çıkarın.
CSS Renk Dönüştürücü
CMYK, HSV, RGB, HSL ve HEX biçimleri arasında dönüştürme.

Renk Kontrast Denetleyicisi

WCAG kontrast oranlarını ön ve arka plan renkler için hesaplayın ve ortak metin boyutu sonuçları gösterin.

Giriş
2 geçerli CSS renk ve seçmeli önizleme metni.
Çıktı
WCAG AA ve AAA geçiş veya eksiklik göstergeleri ile bir kontrast oranı.
Gerçek Sınırlamalar
Hesaplama yalnızca aydınlatma kontrastını kapsamaktadır; yazı tipi renderasyon, hareket, odak veya renkli olmayan koşular için bir arayüz veya hesap doğrulamıyor.
Gizlilik ve veri işleme
İki geçerli CSS renk ve seçmeli önizleme metni bu tarayıcı sekmesinde işlenir. dönüştürücü almaz veya depolamaz; sayfanın kapatılması veya yeniden yüklemesi, aracın açıkça yerel bir indirme sunmadığı sürece çalışma durumunu temizler.

Bu aracı nasıl kullanırız

  1. İki geçerli CSS renk ve seçmeli önizleme metni araç kontrollerinde sağlayın.
  2. WCAG AA ve AAA ile kontrast oranını etkileyen ayarları seçin veya işaretçileri geçin, sonra aracı çalıştırın.
  3. WCAG AA ve AAA ile bir kontrast oranı geçmeden önce kopyalanmadan veya indirmeden önce geçip başarısız olan göstergeleri inceleyin.

• Ortak başarısızlık modları

Geçersiz renkler ölçülemez ve çözünmüş bir arka plan olmadan şeffaflık bir oran anlamlı hale getirebilir.

Faydalı örnek

#fffff'de #ff2937 metni karşılaştırın ve normal ve büyük metin arasındaki oranını inceleyin.