RGB - HEX Dönüştürücü

Bu Sayfa Ne Yapar – Farkı Nedir?

Bu sayfa, kırmızı, yeşil ve mavi (RGB) değerlerini – her biri 0 ile 255 arasında bir sayı – alır ve anında bunlara karşılık gelen altı haneli hex (onaltılık) renk kodunu üretir. Örneğin 79, 70, 229 girdisi #4F46E5 çıktısını verir. Araç aynı anda rengin kendisini bir renk örneği (swatch) olarak gösterir ve HSL, HSV, CMYK, LAB gibi diğer tüm renk formatlarını da günceller. Böylece hex değerini alıp doğrudan CSS’de, tasarım yazılımında veya hex bekleyen herhangi bir iş akışında kullanabilirsiniz.

Bu sayfayı benzer araçlardan ayıran en önemli özellik şudur: RGB (ondalık, üç kanal 0‑255) ile hex (onaltılık, altı basamak) arasındaki dönüşüm bire bir ve kayıpsızdır. Her iki format da aynı renk gamını – çoğu ekranın kullandığı sRGB çalışma alanını – temsil eder. Bu nedenle gam kırpılması veya yaklaşıklama olmaz. Hex çıktısı her zaman # ile başlar ve sekiz haneli form kullanılmadıkça alfa kanalı (saydamlık) taşımaz. Araçta “dönüştür” butonu yoktur; herhangi bir format alanını düzenlemek diğer tüm alanları anında günceller. Tüm işlemler tarayıcınızda gerçekleşir – girdiğiniz hiçbir şey sunucuya yüklenmez.

RGB Renk Modeli ve 0–255 Ölçeği

RGB, eklemeli (additive) bir renk modelidir. Kırmızı, yeşil ve mavi ışıkların farklı yoğunluklarda birleşmesiyle geniş bir renk yelpazesi oluşturulur. Her bir kanal için 0 ile 255 arasındaki değerler, 8 bitlik (256 farklı seviye) bir temsili ifade eder. 0, o kanalın tamamen kapalı olduğu anlamına gelir; 255 ise tamamen açık. Örneğin (255, 0, 0) saf kırmızıyı, (0, 0, 0) siyahı, (255, 255, 255) ise beyazı verir.

Bu 0–255 aralığı, bilgisayar donanımı ve yazılımında standart hale gelmiştir. Eski dönemlerde 6 bit (64 seviye) veya daha düşük çözünürlükler kullanılsa da günümüzde 8 bit (16,7 milyon renk) neredeyse evrenseldir. Grafik kartları, monitörler ve görüntü dosyası formatlarının tamamı bu aralığı temel alır. Bu nedenle RGB değerlerini 0–255 dışında girmek (örneğin 300 veya -5) geçersiz kabul edilir ve araç, “0-255 arasında üç sayı girin, örn. 79, 70, 229.” hata mesajını gösterir.

Onaltılık (Hex) Renk Kodlarının Yapısı

Hex renk kodu, # işaretiyle başlayan ve altı onaltılık basamaktan (0–9, A–F) oluşan bir ifadedir. Her iki basamak, bir RGB kanalını temsil eder: ilk iki basamak kırmızı, ortadaki iki yeşil, son iki mavi. Örneğin #1E90FF kodu, kırmızı için 1E (30), yeşil için 90 (144), mavi için FF (255) anlamına gelir.

Altı basamaklı formun yanı sıra üç basamaklı kısa form da vardır: #RGB. Bu formda her bir kanal tek bir onaltılık basamakla gösterilir ve araç tarafından otomatik olarak iki basamaklı hale genişletilir. Örneğin #abc girdisi #AABBCC olarak yorumlanır. Ancak araç, çıktıyı her zaman altı basamaklı olarak verir; üç basamaklı kısaltmaya otomatik olarak daraltma yapmaz. Bunun nedeni, her 0–255 değerinin iki hex basamağa eşlenmesidir. 255 → FF, 0 → 00, 128 → 80 şeklinde (128 = 0x80).

Hex kodları büyük/küçük harf duyarlı değildir. #1e90ff, #1E90FF, #1E90Ff aynı rengi ifade eder. Ancak yaygın uygulama, okunabilirlik için büyük harf kullanmaktır. Standart hex altı basamaklıdır; sekiz basamaklı form (#RRGGBBAA) alfa kanalı ekler, fakat bu araç alfa kanalını desteklemez.

Dönüşüm Matematiği

RGB’den hex’e dönüşüm, her bir ondalık kanal değerinin 16’ya bölünmesiyle yapılır. Bölüm ilk hex basamağını, kalan ise ikinci hex basamağını verir. Yöntem şöyledir:

• Kırmızı: 79 ÷ 16 = 4 (bölüm), kalan 15. 4 → 4, 15 → F. Sonuç 4F.
• Yeşil: 70 ÷ 16 = 4, kalan 6. 4 → 4, 6 → 6. Sonuç 46.
• Mavi: 229 ÷ 16 = 14, kalan 5. 14 → E, 5 → 5. Sonuç E5.

Birleştiğinde #4F46E5 elde edilir. Bu dönüşüm sRGB renk uzayı içinde tamamen kayıpsızdır. Yani her bir RGB üçlüsüne karşılık gelen tek ve kesin bir hex kodu vardır ve tersi de geçerlidir. Aşağıdaki tablo, 0–255 arasındaki bazı değerlerin hex karşılıklarını gösterir:

Pratikte, 0–255 arasındaki her ondalık değer bir hex çiftine dönüştürülür. Örneğin 200 → C8 (200 = 12×16 + 8). Bu nedenle araç üç kanal için her zaman altı basamaklı çıktı verir.

Giriş Biçimlendirmesi ve Kenar Durumlar

Araç, RGB girişini üç sayı olarak bekler. Bu sayılar virgül veya boşlukla ayrılabilir. Geçerli giriş örnekleri: 79, 70, 229 veya 79 70 229. Sondaki boşluklar veya baştaki boşluklar kırpılır; ancak iki sayı arasında hem virgül hem boşluk olması da kabul edilir. Dört sayı, harf, ondalık sayı (örneğin 79.5) veya geçersiz ayraç (noktalı virgül, tire) gibi durumlar hata mesajına yol açar.

Araç, üç haneli hex kısaltmasını (#abc) giriş olarak kabul eder ve dahili olarak #AABBCC formatına genişletir. Ancak bu yalnızca hex giriş alanı için geçerlidir; RGB giriş alanı üç haneli bir temsil almaz. Eğer RGB girişi 0–255 aralığı dışında değerler içeriyorsa veya sayılar doğru biçimlendirilmemişse, araç yukarıda belirtilen hata mesajını gösterir.

Bu araçtaki tüm işlemler istemci tarafında (tarayıcınızda) çalışır. Hiçbir veri sunucuya gönderilmez veya kaydedilmez. Bu, renk değerlerinin gizliliğini ve hızını garanti eder.

Pratik Kullanımlar: CSS, Tasarım ve Ötesi

Hex renk kodları, web teknolojilerinde en yaygın kullanılan renk formatlarından biridir. CSS’de color: #1E90FF; veya background-color: #4F46E5; şeklinde doğrudan kullanılır. Front-end geliştiriciler, tasarım araçlarından aldıkları RGB değerlerini hızlıca hex’e çevirmek için bu dönüştürücüyü kullanır.

UI/UX tasarımcıları, Photoshop, Sketch, Figma gibi araçlardan RGB değerleri alır. Bu değerleri geliştiricilere iletirken hex kodu daha kısa ve standart olduğu için tercih edilir. Grafik tasarımcılar, RGB prototipleri ile hex kodlu uygulamalar arasında renk tutarlılığı sağlamak için bu araca ihtiyaç duyar.

Öğrenciler ve hobi olarak uğraşanlar, dijital rengin ondalık ve onaltılık temsilleri arasındaki ilişkiyi öğrenmek için bu sayfayı kullanabilir. Tarayıcı geliştirme araçları (DevTools) sayfa üzerindeki bir öğenin rengini genellikle RGB olarak gösterir; bu değerleri hex’e çevirerek CSS koduna yapıştırmak pratik bir iş akışıdır.

Ayrıca bu araç, renk seçici (color picker) verilerini işlemek için de kullanışlıdır. Örneğin, bir görsel düzenleme yazılımından kopyalanan RGB üçlüsü, web sitesinde doğru rengi elde etmek için hex’e dönüştürülür.

Sıkça Sorulan Sorular (SSS)

Soru: Hata mesajı hangi durumlarda görünür? Cevap: Girdiğiniz RGB değerlerinden herhangi biri 0–255 aralığı dışındaysa veya sayıları virgül/boşluk dışında bir karakterle ayırmışsanız (örneğin noktalı virgül, tire, harf) araç “0-255 arasında üç sayı girin, örn. 79, 70, 229.” hata mesajını gösterir.

Soru: Hex kodu için üç haneli kısaltma (ör. #abc) kullanabilir miyim? Cevap: Evet, hex giriş alanına üç haneli bir kod yazabilirsiniz. Araç bunu otomatik olarak altı haneli hale genişletir (örneğin #abc → #AABBCC). Ancak çıktı alanında her zaman altı haneli form gösterilir; kısaltma yalnızca girişte kabul edilir.

Soru: Çıktı neden her zaman altı haneli? Cevap: Çünkü her bir RGB kanalı (0–255) iki onaltılık basamakla ifade edilir. Üç kanal toplam altı basamak eder. Araç, kullanıcıya standart ve tam formatı sağlamak için altı haneli çıktıyı tercih eder. Kısaltma yapmak isteyen kullanıcılar kodlarını elle kısaltabilir, ancak araç bu daraltmayı otomatik olarak yapmaz.

Soru: Alfa kanalı (saydamlık) içeren hex kodu nasıl elde ederim? Cevap: Bu araç yalnızca altı haneli standart hex kodunu üretir. Sekiz haneli form (#RRGGBBAA) alfa kanalı gerektirir ve bu sayfada desteklenmez. Alfa bilgisi içeren bir dönüşüm için ayrı bir araca ihtiyacınız vardır.

Soru: Dönüşüm neden tamamen kayıpsız? Cevap: Hem RGB hem de hex, aynı sRGB renk uzayını kullanır. sRGB içinde her bir RGB değeri (0–255) benzersiz bir hex koduna karşılık gelir ve tersi de geçerlidir. Bu nedenle dönüşüm sırasında hiçbir renk bilgisi kaybolmaz veya yaklaşıklaştırılmaz.

Soru: Giriş olarak üç sayı dışında başka bir şey girebilir miyim? Cevap: Hayır. Araç yalnızca boşluk veya virgülle ayrılmış üç sayıyı kabul eder. Dört sayı, ondalık sayı, negatif sayı veya harf içeren girişler hata mesajına yol açar. Geçerli bir örnek: 128, 0, 128.