Renk Dönüştürücü
Renkleri HEX, RGB, HSL ve OKLCH arasında canlı önizlemeyle dönüştürün
Bu araç hakkında
Bir rengi yaygın gösterimlerin herhangi biriyle girin — #hex, rgb(), hsl() ya da CSS renk adı — ve tüm biçimleri aynı anda alın: HEX, RGB, HSL ve OKLCH, yanında canlı bir örnek kareyle. Alfa kanalları biçimler arasında korunur ve çıktı, güncel stil dosyalarına temizce yapıştırılan modern CSS sözdizimini (boşlukla ayrılmış kanallar) kullanır.
OKLCH dâhil edildi, çünkü CSS rengi oraya gidiyor: HSL’den farklı olarak açıklık ekseni algısal olarak tekdüzedir; yani aynı L değerine sahip iki renk gerçekten eşit parlaklıkta görünür ve tonu değiştirmek algılanan parlaklığı kazara değiştirmez. Var olan bir paleti OKLCH’ye çevirmek, tutarlı renk skalaları kurmanın ilk adımıdır.
Dönüşüm matematiği yayımlanmış sRGB↔OKLab dönüşümleriyle yerelde çalışır ve değerler gidip geri döner: bir HSL girdisinden aldığınız RGB, tarayıcının hesaplayacağının tam olarak aynısıdır.
Sıkça sorulan sorular
- HSL ile OKLCH açıklık değerleri neden birbirini tutmuyor?
- HSL açıklığı, insan görüşünün değil RGB değerlerinin geometrik bir özelliğidir — hsl(60 100% 50%) sarısı, aynı L değerine sahip olmasına rağmen hsl(240 100% 50%) mavisinden çok daha parlak görünür. OKLCH’nin L ekseni algıyla örtüşecek şekilde tasarlanmıştır; yani eşit L, eşit görünür parlaklık demektir. Bu uyuşmazlık, OKLCH’nin var olma sebebinin ta kendisidir.
- Alfa değeri ne anlama geliyor ve her biçimde nereye yazılıyor?
- Alfa donukluktur; 0 (saydam) ile 1 (tam opak) arasındadır. 8 haneli hex’te son bayttır (#RRGGBBAA); modern işlevsel sözdiziminde bir eğik çizginin ardından gelir: rgb(76 141 255 / 0.5). Bu dönüştürücü alfayı her biçimde kendiliğinden taşır.
- Her OKLCH rengi sRGB’de gösterilebilir mi?
- Hayır — OKLCH geniş renk gamlarını kapsar ve bazı kroma/açıklık birleşimlerinin sRGB karşılığı yoktur. sRGB’den dönüştürmek (bu aracın yaptığı gibi) her zaman gösterilebilir kalır; ters yönde ise gam dışı renkler kırpılmalı ya da eşlenmelidir — canlı bir P3 yeşilinin sRGB ekranda daha donuk görünmesinin nedeni budur.
- Neden virgüllü değil de boşluklu rgb(76 141 255)?
- CSS Color Module Level 4, isteğe bağlı /alfa ile birlikte boşlukla ayrılmış kanalları standartlaştırdı ve her modern tarayıcı bunu destekliyor. Virgüllü biçim hâlâ çalışır ama yeni belirtimlerin (ve bu aracın) kullandığı boşluklu biçimdir.