Sonucunuz burada görünecek
Bilgileri doldurun ve Hesapla'ya basın.
Web tasarımda renkler genellikle HEX kodla (ör. #0C6B5E) ifade edilir, ama CSS'te renk tanımlamanın RGB (kırmızı-yeşil-mavi) ve HSL (renk tonu-doygunluk-parlaklık) gibi başka biçimleri de vardır — üçü de aynı rengi farklı sayı sistemleriyle tarif eder.
HEX renk kodunu girin; RGB ve HSL karşılıklarını anında görün.
HTML Renk Kodu nasıl hesaplanır?
HEX'ten RGB'ye
HEX kod, rengi kırmızı-yeşil-mavi bileşenlerinin her biri için 00-FF (0-255) arasında iki basamaklı onaltılık (hexadecimal) sayılarla ifade eder; bu üç değer doğrudan RGB gösterimine (0-255 aralığında ondalık sayılar) çevrilir.
RGB'den HSL'ye
HSL, aynı rengi farklı bir mantıkla tarif eder: renk tonu (hue, 0-360 derece renk çemberinde konum), doygunluk (saturation, %0 gri - %100 canlı renk) ve parlaklık (lightness, %0 siyah - %100 beyaz). RGB değerlerinden matematiksel bir dönüşümle hesaplanır.
Kısaltılmış (3 haneli) HEX
Bazı HEX kodları kısaltılmış 3 haneli biçimde yazılır (ör. #0C6 gibi); bu durumda her hane kendisiyle ikilenerek (0→00, C→CC, 6→66) 6 haneli tam forma genişletilir, dönüşüm ondan sonra yapılır.
Örnek hesap
Kalkoro'nun marka rengi #0C6B5E, RGB'de rgb(12, 107, 94)'e, HSL'de hsl(172, 80%, 23%)'e karşılık gelir.
Sık sorulan sorular
HEX, RGB ve HSL hangi durumda hangisi tercih edilir?+
HEX, tasarım dosyalarında ve CSS'te en yaygın kısa yazımdır; RGB, rengi bileşen bileşen (ör. kırmızıyı artırmak) değiştirmek isteyenler için sezgiseldir; HSL ise "aynı tonu daha koyu/açık yap" gibi ayarlamalarda daha kullanışlıdır.
3 haneli kısa HEX kodları da destekleniyor mu?+
Evet, #RGB biçimindeki kısaltılmış 3 haneli kodlar otomatik olarak 6 haneli tam forma genişletilip öyle hesaplanır.
HEX kodun başındaki "#" işareti zorunlu mu?+
Hayır, işaretle veya işaretsiz (ör. "0C6B5E" veya "#0C6B5E") girilebilir, sonuç aynıdır.
Renk isimleri (ör. "kırmızı") de kabul ediliyor mu?+
Hayır, bu araç yalnızca HEX kod formatını kabul eder; renk ismi girmeniz gerekiyorsa önce bunu bir HEX koduna çevirmeniz gerekir.
Son güncelleme: