OKLCH dönüştürücü ve palet oluşturucu

OKLCH, hex, RGB ve HSL arasında dönüşüm yapın ve algısal olarak eşit kalan renk rampaları oluşturun: ton dönerken açıklık ile kroma sabit tutulur. sRGB dışındaki renkler kanalları kırparak değil, kroma azaltılarak eşlenir — fark, morunuzun mor kalıp kalmadığıdır.

Hex, rgb(), hsl() ya da oklch(). 

    


    

    

      
OKLCH'de açıklık neden anlamlıdır

      
HSL'de açıklık sabitken tonu değiştirmek, rengin ne kadar parlak göründüğünü de değiştirir: %50'deki sarı, %50'deki maviden çok daha parlak görünür; bu yüzden HSL rampaları ne kadar özenle aralıklandırılırsa aralıklandırılsın eşitsiz görünür. OKLab algısal verilere göre oturtuldu, dolayısıyla açıklık ekseni gözün gördüğüyle örtüşür. L ile C'yi sabit tutup H'yi döndürün: her renk örneği aynı görsel ağırlığı taşır — paletleri HSL yerine burada oluşturmanın bütün sebebi budur.

      
Asıl mesele gam eşlemesi

      
Pek çok OKLCH değerinin sRGB'de karşılığı yoktur ve akla ilk gelen çözüm her kanalı geçerli aralığa sıkıştırmaktır. Bu, tonu gözle görülür biçimde kaydırır: kanal kanal kırpılan canlı bir mor maviye doğru sürüklenir. Açıklık ile tonu koruyup yalnızca kromayı azaltmak ise rengi tanınabilir biçimde kendisi olarak bırakır ve yalnızca ekranın gösteremeyeceği doygunluğu alır. Bu sayfa CSS Color 4'ün algoritmasını kullanır: kroma üzerinde ikili arama yapar ve kırpılmış sonuç, kroması azaltılmış renkten ancak fark edilebilecek kadar küçük bir farkla ayrıldığında onu kabul eder.

      
Bir referansa göre doğrulandı

      
Dönüşümler bağımsız bir uygulamayla dört bin renklik bir ızgara üzerinde karşılaştırıldı: açıklık ile kroma milyonda bire kadar, ton derecenin on binde birine kadar uyuşuyor ve her hex değeri gidip geldiğinde tıpatıp aynı çıkıyor. Gamut eşlemesi de aynı yöntemle gamut dışı dört yüz seksen renk üzerinde sınandı; en kötü durumda bile 255'te birlik sınırın içinde kalıyor. OKLCH okuyan biri yanlış bir matrisi fark eder; bu yüzden nasıl doğrulandığını söylemek yerinde göründü.

      
Çıktıyı kullanmak

      
Özel özellikler OKLCH ile yazılır, hex ise yanlarında yorum olarak durur; çünkü incelemede istediğiniz çift budur: derlemenizle yayına giden değer ve başka her yere yapıştırabileceğiniz değer. Bugün kullanılan her tarayıcı OKLCH sözdizimini anlıyor; hâlâ anlamayan bir tarayıcıyı destekliyorsanız yedeğiniz o yorumdur.


      
SSS

      

        
Kroma neden 0,4 ile sınırlı?
Çünkü sRGB'de hiçbir şey ona yaklaşmıyor. sRGB'nin en doygun rengi mavidir, 0,313 civarı; kaydırıcı bunu bilerek aşıyor ki neyin gamın dışına düştüğünü ve geri nasıl eşlendiğini görebilesiniz.

        
Burada fark edilebilir en küçük fark nedir?
OKLab'da 0,02'lik bir delta E; CSS Color 4'ün kullandığı eşik. Bunun altında kırpma ile kroma azaltma ayırt edilemez, bu yüzden algoritma kırpılmış rengi alır ve fazladan kromayı korur.

        
P3 veya Rec2020'yi destekliyor mu?
Henüz değil. Buradaki her şey sRGB'yi hedefler; renk gamı uyarılarının anlamı da bu. Daha geniş renk gamları kendi ana renklerini ve ikinci bir matris setini gerektirir.

        
Bunlardan bir şey bir yere gönderiliyor mu?
Hayır. Dönüşümler bu sayfada yapılır.

      

      
GO AI ekibi tarafından yapıldı. CSS clamp() hesaplayıcı · WCAG kontrast denetleyici · Tüm ücretsiz araçlar