Renk Dönüştürücü

HEX, RGB ve HSL arasında çevirin; kontrast oranını WCAG ölçütlerine göre görün.

Bu araç tarayıcınızda çalışır ve JavaScript gerektirir. Aşağıdaki açıklama ve örnekler JavaScript olmadan da okunabilir.

Tasarımdan gelen renk HEX, CSS'te yazdığınız RGB, karanlık tema için ayarladığınız HSL — hepsi aynı rengin farklı yazımı. Bu araç üçü arasında çevirir ve bir adım daha atar: seçtiğiniz rengin beyaz ve siyah üzerindeki kontrast oranını hesaplayıp WCAG AA eşiğini geçip geçmediğini söyler.

Nasıl kullanılır

Rengi girin HEX, RGB ya da HSL alanlarından herhangi birine yazın; diğerleri anında güncellenir.
Önizlemeye bakın Renk, beyaz ve siyah zemin üzerinde örnek metinle gösterilir.
Kontrastı kontrol edin Oran 4.5:1 altındaysa normal metin için yetersizdir; araç bunu işaretler.

Sık sorulan sorular

WCAG AA için hangi oran gerekiyor?: Normal metin için en az 4.5:1, büyük metin (18pt ya da kalın 14pt) için 3:1. AAA düzeyi sırasıyla 7:1 ve 4.5:1 ister.
HSL ne işe yarar?: Renk tonunu sabit tutup yalnızca açıklığı değiştirmek istediğinizde. Bir markanın açık ve koyu tema varyantlarını HSL üzerinden türetmek, HEX'i elle karıştırmaktan çok daha tutarlı sonuç verir.

İlgili araçlar

Hash (Özet) Üretici Metnin SHA-1, SHA-256, SHA-384 ve SHA-512 özetini alın. CSS Gölge (box-shadow) Üretici box-shadow kuralını kaydırıcılarla kurun, canlı önizlemede görün ve hazır kuralı kopyalayın. CSS Birim Dönüştürücü px, rem, em, pt ve vw birimleri arasında çevirin; kök yazı boyutunu kendiniz belirleyin.