Skip to content
Zoyku

Renk Dönüştürücü

Bir rengi hex, rgb() veya hsl() olarak yapıştır; üç biçimi de artı tasarım sistemine hazır bir tente-gölge satırı al.

Color (hex, rgb() or hsl())
#0071e3
rgb(0, 113, 227)
hsl(210, 100%, 45%)
Tints & shades

The swatch row mixes the color with white (left) and black (right) at 20/40/60/80% — handy for hover states and dark-mode variants.

Bu araç tamamen tarayıcında çalışır. Verilerin asla cihazından çıkmaz — hiçbir sunucuya yüklenmez.

Nasıl kullanılır

  1. 1Bir rengi üç biçimden herhangi biriyle yapıştır — hex, rgb() veya hsl().
  2. 2Dönüştürülmüş değerleri oku ve ihtiyacın olanı kopyala.
  3. 3Tente ve gölgeleri aşağıdaki palet satırından al.

Renk Dönüştürücü

Ona #0071e3, rgb(0, 113, 227) veya hsl(211, 100%, 45%) ver — ayrıştırıcı biçimi otomatik algılar ve hex, RGB ve HSL'i bir kerede verir; her biri tek tıkla kopyalanır.

Değerlerin altında bir tente-gölge satırı, rengini beyaz ve siyahla %20/40/60/80 adımlarında harmanlar: anında hover durumları, kenarlıklar ve karanlık mod varyantları — tasarım aracı açmadan.

Sık sorulan sorular

HSL, RGB'ye nasıl dönüştürülür?

Standart Silindirik–RGB eşlemesiyle: kromatiklik c = (1 − |2L − 1|) × S, ton sektörüne göre belirlenen ara bir x, sonra her kanal m = L − c/2 kadar kaydırılır. Matematik ders kitabı formülleridir; sonuçlar tasarım araçlarıyla eşleşir.

Renk kodum neden geçersiz görünüyor?

Kabul edilen biçimler #RGB / #RRGGBB, rgb(r, g, b) ve hsl(h, s%, l%). Kanallar aralıkta olmalıdır (RGB için 0–255, ton için 0–360, geri kalanı için %0–100) ve her parça virgül veya boşlukla ayrılmalıdır.

Tenteler ve gölgeler ne işe yarar?

Tenteler (beyazla harmanlanan) hover zeminleri, rozetler ve kartlar yapar; gölgeler (siyahla harmanlanan) basılı durumları, kenarlıkları ve karanlık mod yüzeylerini. Her ikisini tek bir marka renginden türetmek, her arayüz durumunu görsel olarak tutarlı tutar.

Bu aracı gömün

Tek satırla bu aracı sitenize ekleyin — ziyaretçinin tarayıcısında çalışır.

<iframe src="https://zoyku.com/tr/tools/color-converter?embed=1" width="100%" height="640" style="border:0;border-radius:16px" title="Zoyku — color-converter" loading="lazy"></iframe>
100% local processing