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

Q: RGB'den HSL'yi nasıl hesaplayabilirim?

Önce her RGB kanalını 255'e bölün, sonra en büyük değeri M ve en küçük değeri m olarak bulun. Açıklık L=(M+m)/2 değeridir. M=m ise doygunluk sıfırdır ve tonun anlamlı bir değeri yoktur. Aksi halde doygunluk (M-m)/(1-|2L-1|); ton ise en büyük kanala bağlıdır. Örneğin saf kırmızı olan rgb(255, 0, 0), hsl(0, 100%, 50%) değerine eşittir.

Güncellendi: 3 Ekim 2026

Bir CSS renk adı veya kodu girerek RGB, HEX, HSL, HWB, CMYK ve NCol değerlerini ve renk önizlemesini görün.

HEX ⇄ RGB ⇄ HSL Renk Dönüştürücü

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

Formül

\[R=16h_1+h_2,\qquad G=16h_3+h_4,\qquad B=16h_5+h_6\]

Burada:

\(h_1,\ldots,h_6\) — bir HEX rengin altı basamağı; 0 ile 15 arası değerler olarak okunur; A'dan F'ye kadar olan harfler 10 ile 15 arası sayıları temsil eder.
\(R\), \(G\) ve \(B\) — kırmızı, yeşil ve mavi kanal değerleri; her biri 0 ile 255 arasındadır.

Bu formül altı basamaklı bir HEX rengi RGB'ye dönüştürür. Hesaplayıcı, desteklenen diğer renk biçimlerini de kabul eder ve bunlar arasında dönüşüm yapar.

Renk Dönüştürücü – Hesaplama Örneği

Örnek: varsayılan girdi skyblue rengidir. Bu adlandırılmış renk #87CEEB değerine karşılık gelir, dolayısıyla HEX basamak çiftleri RGB'ye dönüştürülebilir.

\[R=8(16)+7=135,\qquad G=12(16)+14=206,\qquad B=14(16)+11=235\]

Sonuç: skyblue renginin HEX değeri #87CEEB, RGB değeri ise rgb(135, 206, 235) şeklindedir. HSL değerleri yaklaşık olarak 197° ton, %71 doygunluk ve %73 açıklıktır.

Renk Dönüştürücü nasıl kullanılır

Renk alanına bir renk girin. Varsayılan skyblue ile başlayabilir, red gibi bir CSS renk adı yazabilir ya da #f00 veya rgb(255,0,0) gibi bir kod girebilirsiniz.
Yorumlanan girdinin görsel önizlemesi için Renk sonucuna bakın.
İhtiyacınız olan biçimi Ad, RGB, HEX, HSL, HWB, CMYK veya NCol alanlarından kopyalayın.

Ad alanında "ad yok" yazıyorsa, rengin dönüştürücünün adlandırılmış renkler listesinde karşılığı yok demektir. Sayısal sonuçlar yine de geçerli bir rengi temsil ediyor olabilir.

Renk biçimleri ne anlama gelir

Dijital bir renk, görünümünü değiştirmeden birkaç farklı yolla tanımlanabilir. HEX, kırmızı, yeşil ve maviyi onaltılık basamak çiftleri olarak yazar: #87CEEB, 16'lık tabanda kırmızı için 87, yeşil için CE ve mavi için EB anlamına gelir. RGB, aynı kanalları 0 ile 255 arası ondalık sayılarla ifade eder. 16'lık taban aritmetiğini ayrıca çalışmak isterseniz Hex Dönüştürücü'yü kullanın; o, sayıları dönüştürür, tam CSS renk değerlerini değil.

HSL ton, doygunluk ve açıklığı tanımlar. Ton, genellikle derece cinsinden ifade edilen, renk çemberi üzerindeki bir konumdur; doygunluk renk yoğunluğunu, açıklık ise siyahtan beyaza doğru giden bir ölçeği anlatır. HWB ise bunun yerine ton, beyazlık ve siyahlık kullanır. Tonları karşılaştırırken veya bir rengi gözle ayarlarken bu biçimler daha okunabilir olabilir. Bir şartname tam kanal değerleri istediğinde RGB ve HEX genellikle daha kullanışlıdır.

CMYK, ekran renginden türetilen camgöbeği, macenta, sarı ve siyah değerlerini verir. NCol, dönüştürücünün sunduğu ton tabanlı bir gösterimdir; CSS'de HEX, RGB veya HSL kadar yaygın kullanılmaz. Çıktı biçimi, bir rengin yazılışını değiştirir, seçilen rengin kendisini değil. Yüzdelerde görülen küçük farklar, yuvarlamadan kaynaklanabilir.

Pratik sınırlar ve ipuçları

Dönüştürücü, renk ayrıştırıcısının tanıdığı bir girdiye ihtiyaç duyar. Standart CSS renk adları ve yaygın CSS tarzı renk kodları iyi başlangıç noktalarıdır. Üç basamaklı bir HEX kodu bir kısaltmadır: örneğin #f00, #ff0000 olarak açılır. HEX harfleri büyük-küçük harfe duyarsızdır; bu yüzden #87ceeb ve #87CEEB aynı rengi temsil eder.

Bazı girdiler, saydamlığı kontrol eden bir alfa değeri içerir. Alfa içeren tanınan girdiler için RGB, HSL, HWB ve NCol sonuçları alfa içeren biçimleri kullanır. Sonucu başka bir uygulamaya kopyalamadan önce her sonucu kontrol edin: listelenen her biçim saydamlığı aynı şekilde tanımlamaz. Bir renk kısmen saydamken önizleme, farklı bir arka planda farklı görünebilir.

Buradaki CMYK, dijital bir renkten yapılan matematiksel bir dönüşümdür, baskı profili dönüşümü değildir. Basılı görünüm yazıcıya, mürekkeplere, kâğıda ve renk yönetimi ayarlarına bağlıdır; bu yüzden tam üretim rengi önemli olduğunda uygun bir baskı iş akışı kullanın. Aynı şekilde, bir rengin ekrandaki görünümü ekrana ve ayarlarına bağlıdır; yalnızca sayısal değerlerin eşleşmesi her cihazda aynı görünümü garanti etmez.

Bir HEX rengini bir URL sorgu parametresine yerleştirirseniz, # işaretinin URL'lerde özel bir anlam taşıdığını unutmayın. Gerekli olduğunda değeri kodlamak için URL Kodlayıcı'yı kullanın.

Sıkça Sorulan Sorular

RGB'yi elle HEX'e nasıl dönüştürürüm?

Her RGB kanalını ondalıktan iki onaltılık basamağa dönüştürün, ardından üç çifti # işaretinden sonra birleştirin. Bir kanal değerini 16'ya bölün: tam sayı bölüm ilk basamak, kalan ise ikinci basamaktır. Örneğin 206, bölüm 12 (C) ve kalan 14 (E) verir, yani CE olur. 16'dan küçük bir değer başa sıfır alır; örneğin 9, 09 olur.

RGB'den HSL'yi nasıl hesaplayabilirim?

Önce her RGB kanalını 255'e bölün, sonra en büyük değeri \(M\) ve en küçük değeri \(m\) olarak bulun. Açıklık \(L=(M+m)/2\) değeridir. \(M=m\) ise doygunluk sıfırdır ve tonun anlamlı bir değeri yoktur. Aksi halde doygunluk \((M-m)/(1-|2L-1|)\); ton ise en büyük kanala bağlıdır. Örneğin saf kırmızı olan rgb(255, 0, 0), hsl(0, 100%, 50%) değerine eşittir.

Metin ve arka plan renkleri için iyi bir kontrast oranı nedir?

Yaygın WCAG 2.2 AA hedefleri için normal metinde en az 4,5:1, büyük metinde 3:1 oranını hedefleyin. AAA hedefleri sırasıyla 7:1 ve 4,5:1'dir. Yalnızca bir renk dönüştürücü, bir eşleşmenin bu hedefleri karşılayıp karşılamadığını söyleyemez: kontrast iki renge de bağlıdır. Gerçek ön planı ve arka planı birlikte kontrol edin; saydam renklerin arkasındaki görünür arka planı da dahil edin.

Gri bir renk neden ton değerine sahip?

Bir renkte doygunluk olmadığında, yani üç RGB kanalı eşit olduğunda, ton matematiksel olarak tanımsızdır. Bir dönüştürücü, HSL veya HWB gösterimini eksiksiz tutmak için genellikle 0° gibi bir yer tutucu ton gösterebilir. Bu sayı griyi kırmızımsı yapmaz. Doygunluk sıfıra yaklaştıkça, küçük kanal değişiklikleri de belirgin bir görsel değişiklik olmadan bildirilen tonda büyük değişikliklere yol açabilir.

Alfa değeri rengin RGB kanallarını değiştirir mi?

Alfa, bir rengin arka plan üzerinde ne kadar göründüğünü kontrol eder; tek başına rengin saklanan RGB kanallarını değiştirmez. 0 alfa değeri tamamen saydam, 1 ise tamamen opaktır. Görünür sonuç arka plana bağlıdır: her kanal için görüntülenen değer yaklaşık olarak \(\alpha\times\text{ön plan}+(1-\alpha)\times\text{arka plan}\) şeklindedir. Bu yüzden saydam bir kırmızı, beyaz üzerinde pembe görünebilir.

Bir renk, dönüşümler arasında neden hafifçe değişebilir?

Dönüşümler yuvarlamaya yol açabilir. RGB kanalları genellikle 0 ile 255 arası tam sayılar olarak saklanırken, HSL ve diğer biçimler yuvarlanmış derece veya yüzde gösterebilir. Bu yuvarlanmış sonuçları yeniden girdiğinizde biraz farklı RGB değerleri elde edebilirsiniz. Bir RGB rengini düzenlemeler veya kopyalamalar sırasında tam olarak korumak için, yuvarlanmış ara sonuçlara güvenmek yerine özgün RGB veya altı basamaklı HEX değerini kullanın.