RGB Renk Kodu Nedir? Nasıl Kullanılır?

RGB renk modeli, dijital dünyada renk üretmek için kullanılan bir sistemidir. RGB kelimesi, İngilizce red(kırmızı), green(yeşil) ve blue(mavi) kelimelerinin baş harflerinden oluşur. İstenilen rengin ortaya çıkması, bu 3 rengin birbirleriyle ne derecede karıştırılacağı ile alakalıdır. Yani ne miktarda kırmızı, ne miktarda yeşil ve ne miktarda mavinin karışımıyla istenilen renk elde edilir.

RGB renk kodlarındaki kırmızı, yeşil ve mavi renkleri, 0 ile 255 arasında bir değer alır ve bu değer o rengin ne yoğunlukta bulunacağını ifade eder. 0 değeri için karışımda o rengin hiç kullanılmayacağı ifade edilirken, 255 değeri ise o rengin yoğun bir şekilde kullanılacağını ifade eder. Örnek olarak RGB(250, 100, 0) ifadesinde yer alan 250 değeri kırmızı rengi, 100 değeri yeşil rengi, 0 değeri ise mavi rengini temsil eder ve ortaya turuncunun bir tonu çıkmış olur. RGB(250, 100, 0) örneğindeki 3 rengin karışımında, kırmızı(250) rengi ağırlıkta kullanılmış, mavi(0) rengi ise hiç kullanılmamıştır.

RGB ile bazı renkler şu şekilde ifade edilir;RGB Renk Kodu Örnekleri

Görselde görüleceği gibi kırmızıyı elde etmek için kırmızı 255, yeşil ve mavi 0 kullanılmıştır. Farklı renkler elde etmek için sizler daha farklı değerleri kullanabilirsiniz.

255 tane kırmızı tonu, 255 tane yeşil tonu ve 255 tane mavi tonu kullanılarak 16.581.375(255x255x255) tane farklı renk elde edilebilir.

RGBA Nedir?

Bazı yerlerde RGBA şeklinde bir kullanım görebilirsiniz. RGBA ifadesinin, RGB modelinden tek farkı sonda bir “Alfa” değerinin bulunmasıdır. Alfa değeri rengin saydamlık(opacity) değerini belirtir ve 0 ile 1 arasında bir değer alır. Alfa değeri %0(0) ise renk tamamen transparan, %50(0.5) ise renk yarı saydam olur ve bu değeri dilediğiniz gibi değiştirebilirsiniz.

HEX Renk Kodu Nedir?

HEX renk kodları, RGB ile ifade edilen değerlerin, harflerinde yardımıyla daha kısa ifade edilişidir. Bu model genellikle grafik tasarım programları ve web tasarımlarında tercih edilir.

HEX renk kodları, 16lık sistem kullanılarak ifade edilir. HEX renk kodlarının başında “#” işareti bulunur ve 6 basamaklıdır. İlk 2 basamak kırmızı rengi, sonraki 2 basamak yeşil rengi ve son 2 basamak ise mavi rengini temsil eder. Aşağıdaki görselde RGB modelinde yer alan 0 ile 255 arasındaki değerlerin, HEX karşılıkları yer alıyor.HEX Renk Kodlarının RGB Renk Kodu Karşılıkları

Buna göre karışımda kırmızı rengini istemiyorsanız 00, tam kırmızıyı istiyorsanız FF renk kodunu seçmeniz yeterli. Örnek olarak kırmızı için ##FF0000, yeşil için #00FF00, mavi için #0000FF, beyaz için #FFFFFF ve siyah için #000000 değerlerini kullanmanız gerekir.

İpucu: Eğer kullanacağınız HEX renk kodu tekrar eden bir yapıda ise(#FF22AA, #00BBCC gibi) tekrar eden harf veya rakamları bir kez belirtmeniz yeterli olacaktır. #F2A renk kodu #FF22AA kodu ile aynı işlevi görecektir.

HSL Renk Kodu Nedir?

HSL, yine RGB renk modelinin farklı ifade edildiği bir sistemdir. Ancak, RGB ve HEX renk sisteminde 16 milyon küsür renk seçeneği varken, HSL’de bu sayı daha düşüktür. HSL, İngilizce Hue(Ton), Saturation(Doygunluk) ve Lightness(Parlaklık) kelimelerinin baş harflerinden oluşur.

Hue(Ton): 0 ile 360 arasında değer alır. 0-120 değerleri arasında kırmızı tonları, 120-240 arasında yeşil tonları, son olarak 240-360 arasında mavi tonları yer alır.

Saturation(Doygunluk): Bu değer yüzde ile ifade edilir. %0 griye yakın koyu bir rengi çağrıştırırken, %100 ise tam renk tonunu çağrıştırır. Örnek olarak Hue(ton) kısmında kırmızı bir renk seçtiyseniz ve Saturation(doygunluk) ayarını %20 yaparsanız daha koyu bir kırmızı, %70 yaparsanız daha açık bir kırmızı elde edersiniz.

Lightness(Parlaklık): Bu değer de yüzde ile ifade edilir. %0 ile siyah bir renk, %100 ile beyaz bir renk elde edersiniz.

Aşağıdaki görselde kırmızı renginin RGB, HEX ve HSL renk kodlarını inceleyebilirsiniz.Kırmızı Renginin HEX, RGB ve HSL Renk Kodu Karşılıkları

Ayrıca Google‘a ait bir araçla RGB, HEX, HSL gibi farklı renk kodlarının dönüşümlerini yapabilirsiniz. Merak ettiğiniz ve değinmemi istediğiniz konuları yorumlarda belirtebilirsiniz. Sağlıcakla kalın.

Yazar Hakkında

programhanesi'nin kurucusu ve tek yazarı..

Makaleleri Görüntüle