HSL'den RGB'ye Dönüştürücü nedir?
HSL; Ton (Hue), Doygunluk (Saturation) ve Açıklık (Lightness) kelimelerinin kısaltmasıdır ve rengi sezgisel bir şekilde tanımlamanın yoludur. Burada ton, renk çarkındaki bir açıdır (0-360°), doygunluk rengin yoğunluğunu (0-100%) belirtir ve açıklık ise rengin ne kadar açık veya koyu olduğunu (0-100%) gösterir. RGB ise aynı rengi üç kanalla ifade eder: Kırmızı, Yeşil ve Mavi. Her biri 0 ile 255 arasında değer alır ve bu, ekranların, CSS'in ve görsel dosyalarının kullandığı formattır. Bu dönüştürücü, bir HSL rengini tam karşılığı olan RGB değerine çevirir.
Nasıl kullanılır?
Tonu derece olarak, doygunluğu yüzde olarak ve açıklığı yüzde olarak girin. Hesap makinesi, eşleşen rgb(r, g, b) üçlüsünü anında verir ve rengi gözle doğrulayabilmeniz için canlı bir önizleme örneği gösterir.
Formülün açıklaması
Öncelikle S ve L değerlerini kesirlere (0-1) dönüştürün. Renklilik (chroma) şöyle hesaplanır:
$$C = (1 - |2L - 1|) \times S$$Ara bileşen
$$X = C \times \left(1 - \left|(H/60 \bmod 2) - 1\right|\right)$$şeklindedir ve eşleştirme değeri
$$m = L - \frac{C}{2}$$her şeyi doğru açıklık seviyesine kaydırır. Ton, her biri 60°'lik altı dilime (sextant) bölünür; her dilim belirli bir sırayla C, X ve 0 değerlerini R, G, B yuvalarına atar. Son olarak her bileşene m eklenir ve 255 ile çarpılır (en yakın tam sayıya yuvarlanır).
Örnek hesaplama
HSL(210°, 50%, 60%) için: \(S = 0{,}5\) ve \(L = 0{,}6\).
$$C = (1 - |1{,}2 - 1|) \times 0{,}5 = (1 - 0{,}2) \times 0{,}5 = 0{,}4$$\(H/60 = 3{,}5\) olduğundan
$$X = 0{,}4 \times (1 - |3{,}5 \bmod 2 - 1|) = 0{,}4 \times (1 - 0{,}5) = 0{,}2$$$$m = 0{,}6 - 0{,}2 = 0{,}4$$3. dilim (\(\le H/60 < 4\)), \((R',G',B') = (0,\ X,\ C) = (0,\ 0{,}2,\ 0{,}4)\) değerlerini verir. m eklenince:
$$(0{,}4,\ 0{,}6,\ 0{,}8) \times 255 = \mathbf{(102,\ 153,\ 204)}$$
Sık Sorulan Sorular
RGB değerlerim neden yuvarlanıyor? RGB kanalları 0 ile 255 arasındaki tam sayılardır; bu yüzden ölçeklenen değerler en yakın tam sayıya yuvarlanır.
Doygunluk %0 olunca ne olur? Tamamen doygunluğu giderilmiş bir renk, değeri yalnızca açıklığa bağlı olan bir gri tonudur; üç RGB kanalı da birbirine eşit olur.
360'tan büyük bir değer girersem ton döner mi? Evet. Ton 360'a göre modunda alınır; dolayısıyla 370° tıpkı 10° gibi davranır.
