Nexsol Araçları · Web & Tasarım
Renk Kodları — HEX, RGB, HSL Listesi
Türkçe renk isimleri, 140 standart HTML/CSS renk adı ve Material Design paleti tek sayfada. Her rengin HEX, RGB ve HSL kodunu tek tıkla kopyalayın. Renk adı veya kod ile anında arayın.
Türkçe renk isimleri ve kodları
En sık aranan Türkçe renklerin HEX karşılıkları. Bir renge tıklayınca o rengin tüm kodları, tonları ve harmonileriyle detay sayfası açılır.
HTML / CSS standart renk adları (140)
W3C tarafından standartlaştırılmış, tüm modern tarayıcıların desteklediği renk adları. color: tomato; gibi doğrudan CSS'te kullanılabilir. Renk ailesine göre gruplandı.
Kırmızılar & Pembeler
Turuncular
Sarılar
Morlar
Yeşiller
Maviler & Cyanlar
Kahverengiler
Beyazlar
Griler & Siyah
Material Design ana renkleri
Google Material Design paletinin 500 seviyesi (ana ton) referans değerleri. Açık/koyu tonları için renk kodu çeviricideki ton & gölge ölçeğini kullanabilirsiniz.
HTML renk kodları nasıl çalışır?
Dijital ekranlarda her renk kırmızı (R), yeşil (G) ve mavi (B) ışığın karışımından oluşur — RGB modeli. Her kanal 0 ile 255 arasında bir değer alır. HEX kodu ise bu üç değeri onaltılık (16'lık) sistemde, #RRGGBB biçiminde yazar: ilk iki hane kırmızıyı, ortadaki ikisi yeşili, son ikisi maviyi ifade eder. Örneğin saf kırmızı #FF0000 = rgb(255, 0, 0) demektir; FF onaltılıkta 255'e karşılık gelir.
HEX, RGB ve HSL arasındaki fark
| Biçim | Yazım | Örnek (Nexsol pembesi) | Ne zaman kullanılır |
|---|---|---|---|
| HEX | #RRGGBB | #D0345F | CSS, tasarım araçları, en yaygın kısayol |
| RGB | rgb(r, g, b) | rgb(208, 52, 95) | Opaklık (RGBA) ve programatik renk üretimi |
| HSL | hsl(h, s%, l%) | hsl(342, 61%, 51%) | Ton sabit tutup açık/koyu palet türetme |
Üçü de aynı rengi gösterir; yalnızca gösterim farklıdır. Bir formattan diğerine anında geçmek için Renk Kodu Çevirici aracını kullanın — CMYK ve HSV dönüşümü, WCAG kontrast kontrolü ve palet üretimi de orada.
Erişilebilir renk seçimi
Renk yalnızca estetik değil, okunabilirlik meselesidir. Metin ile arka planı arasındaki kontrast oranı WCAG'e göre normal metinde en az 4.5:1 olmalıdır. Marka renginizi bir arka planda kullanmadan önce kontrastı doğrulayın; çeviricideki kontrast göstergesi AA/AAA durumunu anında verir. Kurumsal bir tasarım sistemi kurarken bir ana renk seçip ondan ton (beyazla açılmış) ve gölge (siyahla koyulaştırılmış) ölçeği türetmek en sürdürülebilir yoldur.
Sık sorulan sorular
En çok kullanılan renk kodları hangileri?
Web'de en sık kullanılan renkler saf kırmızı (#FF0000), yeşil (#008000), mavi (#0000FF), siyah (#000000), beyaz (#FFFFFF) ve gri tonlarıdır (#808080, #F5F5F5). Marka arayüzlerinde ise genellikle bir birincil renk ve ondan türetilmiş ton/gölge ölçeği kullanılır.
HTML renk kodu nedir?
HTML renk kodu, bir rengi bilgisayarın anlayacağı biçimde ifade etme yöntemidir. En yaygın biçim HEX kodudur: # işaretiyle başlayan ve kırmızı, yeşil, mavi kanallarının onaltılık değerlerini içeren altı haneli bir dizi (#RRGGBB). RGB ve HSL de aynı rengi farklı biçimde yazan alternatiflerdir.
Renk adını doğrudan CSS'te kullanabilir miyim?
Evet. Bu sayfadaki 140 standart renk adı (örneğin tomato, steelblue, crimson) tüm modern tarayıcılarda color veya background gibi özelliklerde doğrudan kullanılabilir. Yine de büyük projelerde tutarlılık için renk adı yerine HEX değişkenleri (CSS custom properties) tercih edilir.
HEX kodunu RGB veya HSL'ye nasıl çeviririm?
Bu sayfadaki her rengin RGB karşılığı zaten listelenir. HSL, HSV, CMYK dönüşümü, alfa/opaklık ve WCAG kontrast kontrolü için Nexsol Renk Kodu Çevirici aracını kullanabilirsiniz; kod girip tüm biçimleri anında alır ve tek tıkla kopyalarsınız.
Bir renge tıklayınca ne oluyor?
Renk kartına tıkladığınızda o renge özel detay sayfası açılır: HEX, RGB, HSL, HSV, CMYK kodları (tek tıkla kopyalanır), ton & gölge ölçeği, renk harmonileri (tamamlayıcı, üçlü vb.), WCAG kontrast durumu, hazır CSS kodu ve o renge en yakın diğer renkler burada listelenir.
Marka için renk paleti nasıl oluşturulur?
Bir ana (birincil) renk seçin, ondan ton (beyazla açılmış) ve gölge (siyahla koyulaştırılmış) bir ölçek türetin ve renk tekerleğinden bir-iki uyumlu vurgu rengi belirleyin. Her metin/arka plan çiftini WCAG kontrast oranıyla doğrulayın. Renk Kodu Çevirici bu ölçeği ve harmonileri otomatik üretir.
Web & Tasarım
Web ve arayüz
Marka renklerinizi kusursuz bir arayüze taşıyalım
Erişilebilir, hızlı ve marka tutarlı kurumsal web siteleri ve tasarım sistemleri.