Guide
Marka Hex Rengini RGB'ye Çevirme Rehberi
Marka kılavuzları neredeyse her zaman hex kodu verir. Canvas, WebGL, yerel mobil arayüzler ve pek çok tasarım aracı bunun yerine RGB kanallarını ister.
By Buğra SözeriPublished
Marka stil kılavuzları renkleri ezici çoğunlukla hex olarak verir — diyelim ki #1A73E8— çünkü kompakttır ve tasarım araçlarıyla CSS’te fiilen varsayılandır. Ancak pek çok kod hex’i doğrudan almaz: Canvas 2D çizim kodu, WebGL shader uniform’ları, yerel mobil renk yapıcıları (UIColor, Android’in bazı yapıcılarda Color sınıfı) ve çeşitli grafik veya veri görselleştirme kütüphaneleri bunun yerine üç ayrı sayısal kanal bekler. Marka hex renginden bu sayılara dönüşüm, tam ve kayıpsız bir taban dönüşümüdür — bir yaklaşıklık değil.
Dönüşüm, adım adım
6 basamaklı bir hex renk, birleştirilmiş üç 16 tabanlı (onaltılık) bayt çiftidir: önce kırmızı, sonra yeşil, sonra mavi; her biri 00’dan FF’ye (ondalıkta 0’dan 255’e) uzanır. #1A73E8 için:
| Hex çifti | Kanal | Ondalık değer |
|---|---|---|
| 1A | Kırmızı | 26 |
| 73 | Yeşil | 115 |
| E8 | Mavi | 232 |
Bu da rgb(26, 115, 232)verir. Her çift bağımsız olarak dönüştürülür — kanallar arası bir matematik yoktur, bu yüzden dönüşüm her iki yönde de tamdır ve yuvarlama hatası olmadan geri döndürülebilir; bu, RGB’yi HSL’ye dönüştürmenin aksinedir — o, gidiş-dönüşte küçük yuvarlama farkları getirebilen kayan nokta trigonometrik hesaplamaları içerir.
Sayıların gerçek kodda göründüğü yerler
Üç kanal değerine sahip olduğunuzda, tam sözdizimi platforma bağlıdır: CSS ve çoğu web API’si doğrudan rgb(26, 115, 232)kabul eder; bazı shader ve grafik API’leri her kanalın 0-1 float’a normalize edilmesini ister (her birini 255’e bölün: 0,102, 0,451, 0,910); yerel mobil çerçeveler genellikle kendi yapıcı imzasına sahiptir (örneğin iOS’ta UIColor(red: 26/255, green: 115/255, blue: 232/255, alpha: 1)). Kanal değerlerinin kendisi bunlar arasında değişmez — yalnızca hedef API’nin beklediği biçimlendirme ve normalizasyon değişir.
Marka renklerini biçimler arasında tutarlı tutmak
En güvenli iş akışı, marka kılavuzundaki hex değerini tek gerçek kaynak olarak ele almak ve diğer her temsili (RGB, normalize edilmiş float’lar, bir tasarım aracı için HSL) zamanla senkronizasyondan çıkabilecek her biçim için ayrı sabitleri elle yazmak yerine, programatik olarak veya bir dönüştürücüyle bundan türetmektir. Kod tabanınız aynı marka rengi için ayrıca baskıya hazır bir CMYK değeri gerektiriyorsa, aynı hex’ten başlayın ve oradan dönüştürün — CMYK’yi ekrandaki renge göre asla gözle tahmin etmeyin.
Frequently asked questions
- Marka stil kılavuzları neden hex kullanır ama bazı kodlar RGB ister?
- Hex kompakttır ve CSS ile tasarım araçlarında varsayılan hale gelmiştir, ancak bazı API'ler — bazı kod yollarında HTML5 Canvas fillStyle, WebGL uniform'ları, yerel iOS/Android renk yapıcıları ve bazı grafik kütüphaneleri — bir hex dizesi yerine ayrı sayısal kırmızı, yeşil, mavi argümanları (genellikle 0-255 veya normalize edilmiş 0-1) alır.
- Hex'i elle RGB'ye nasıl dönüştürürüm?
- 6 basamağı üç çifte bölün, her çifti 16 tabanından 10 tabanına çevirin. #1A73E8: 1A = 26, 73 = 115, E8 = 232, bu da rgb(26, 115, 232) verir. Her çift doğrudan bir kanala eşlenir — yuvarlama veya yaklaşıklık söz konusu değildir, tam bir taban dönüşümüdür.
- Hex'i RGB'ye dönüştürmek hassasiyet kaybına yol açar mı?
- Hayır — hex ve RGB(0-255) tam olarak aynı 24 bit renk uzayını, yalnızca farklı sayı tabanlarında temsil eder, bu yüzden dönüşüm her iki yönde de kayıpsızdır. Hassasiyet kaybı yalnızca daha ileri bir dönüşüm yaptığınızda, örneğin bir shader için normalize edilmiş 0-1 float'a indiğinizde devreye girer; burada kayan nokta yuvarlaması alt piksel düzeyinde önemli olabilir.
- 3 basamaklı hex kısaltmasının RGB karşılığı nedir?
- Önce kısaltmayı her basamağı ikiye katlayarak genişletin — #F63, #FF6633 olur — sonra 6 basamaklı formu normal şekilde dönüştürün: FF = 255, 66 = 102, 33 = 51, bu da rgb(255, 102, 51) verir.
Sources & references
Authoritative references cited by this piece. Verified by Buğra Sözeri on the dates shown and re-checked at every deploy.
- W3C CSS Color Module Level 4 — RGB onaltılık gösterim — Hex basamak çiftleri ile 0-255 RGB kanal değerleri arasındaki resmi eşleme(as of )
- MDN — <color> CSS veri tipi — rgb() fonksiyon sözdizimi ve kabul edilen değer aralıkları için referans(as of )
Related
Published September 25, 2026