Ana içeriğe geç

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

Renkleri HEX, RGB, HSL, HSV ve CMYK formatları arasında anında dönüştürün. Parlaklık ölçeği ve hazır renk örnekleri içerir.

Yüklendikten sonra çevrimdışı çalışır

Bir rengi HEX, RGB, HSL, HSV ve CMYK arasında dönüştür — canlı önizleme ve bir dokunuşla kopyalama ile. Tamamen tarayıcınızda çalışır.

Kabul edilen biçimler: HEX (#fff veya #ffffff), RGB (255, 255, 255) veya HSL (360, 100%, 50%)

100%
Ön ayarlar:
HEX#14B8A6
rgb() · eskirgb(20, 184, 166)
rgb() · modernrgb(20 184 166)
hsl() · eskihsl(173, 80%, 40%)
hsl() · modernhsl(173 80% 40%)
oklch()oklch(70.4% 0.123 182.5)
lab()lab(67.1% -42.9 -2.3)
lch()lch(67.1% 43.0 183.1)
hsv()hsv(173, 89%, 72%)
cmyk()cmyk(89%, 0%, 10%, 28%)
RGB değerleri20, 184, 166

WCAG kontrastı

Beyaz arka plana karşı

2,49:1

Başarısız

Siyah arka plana karşı

8,44:1

AAA
🖨️ Baskı için: Bu CMYK değerleri (89%, 0%, 10%, 28%) referans amaçlı standart bir sRGB→CMYK yaklaşımıdır. Doğru baskı rengi için yazıcınızın ICC profilini veya baskılı bir prova kullanın — ekran CMYK'si her mürekkep/kâğıt bileşimini eşleştiremez.

Açıklık skalası

O tona geçmek için herhangi bir örneğe tıklayın

Yaygın kullanımlar

  • Web Tasarımı için Renkleri DönüştürHerhangi bir renk için HEX, RGB ve HSL değerleri alın — CSS veya Tailwind'e yapıştırmaya hazır.
  • Yazdırma için Renkleri Dönüştür (CMYK)Ekran renklerini (HEX/RGB) basılı tasarım ve profesyonel baskı için CMYK değerlerine dönüştürün.
  • Tasarım Sistemleri için Renk Paleti OluşturMarka renklerini tüm biçimlerde dönüştürün ve tam tasarım sistemi için tutarlı hafiflik ölçekleri oluşturun.
  • Erişilebilirlik için Renk Kontrastını Kontrol EtKontrast oranı araçlarında kullanmak için renkleri dönüştürerek RGB değerlerini al - erişilebilir tasarım için WCAG uygunluğu.
  • Figma için Renkleri DönüştürFigma renk seçicilerine ve tasarım token sistemlerine yapıştırmak için tam HEX ve RGB değerlerini al.

Nasıl çalışır

Tüm dönüştürme mantığı tamamen tarayıcınızda çalışan elle yazılmış JavaScript'tir — kütüphane yok, sunucu çağrısı yok. Araç girdinizi ayrıştırır, bir dizi saf matematik işlevinden geçirir ve modern CSS Color 4 uzayları oklch() ve lab() dahil on bir çıktı biçimini aynı anda üretir.

  1. 1
    Esnek girdi ayrıştırma
    Özel bir ayrıştırıcı onaltılık (3, 4, 6 veya 8 basamak), rgb()/rgba(), hem eski virgüllü hem modern boşluklu sözdizimiyle hsl()/hsla() ve yalın sayısal üçlüleri kabul eder. Ondalık veya yüzde olarak alfa değerleri, herhangi bir dönüştürme başlamadan önce 0–1 aralığına normalleştirilir.
  2. 2
    Dönüştürme merkezi olarak RGB
    Kabul edilen her biçim önce standart bir RGB üçlüsüne çözülür. Araç bu tek temsilden dallanır: HSL ve HSV standart min/maks/kroma formüllerini kullanır; CMYK anahtar kanal bulunarak türetilir; algısal uzay hesaplamalarından önce sRGB doğrusallaştırması (IEC 61966-2-1'de tanımlanan parçalı gama eğrisi) uygulanır.
  3. 3
    Sıfırdan hesaplanan algısal renk uzayları
    oklch(), Björn Ottosson'un referans 3×3 matrisleri (LMS küp kök uzayı) kullanılarak hesaplanır. lab() ve lch(), D65 beyaz noktasından D50'ye dönüştürmek için Bradford kromatik uyarlamasını kullanır; bu, CSS Color 4'ün lab()'ı tanımlama biçimiyle eşleşir. Bunlar tarayıcı çizim motorlarında kullanılan formüllerin aynısıdır — burada herhangi bir harici bağımlılık olmadan uygulanmıştır.
  4. 4
    WCAG kontrastı ve açıklık ölçeği
    Göreli parlaklık WCAG 2.1 formülüne göre hesaplanır (0.2126/0.7152/0.0722 ağırlıklı doğrusallaştırılmış R, G, B) ve beyaz ile siyaha karşı kontrast oranı AA-büyük, AA, AAA veya Başarısız olarak derecelendirilir. HSL açıklık kanalı %10'dan %90'a adım adım ilerletilerek dokuz adımlı bir açıklık şeridi oluşturulur; o tonu dönüştürmek için herhangi bir renk örneğine tıklayabilirsiniz.

İlgili araçlar

Sık sorulan sorular