Ana içeriğe geç
LibraTool logoLibraTool

Ücretsiz Renk Seçici ve Palet Oluşturucu

Renk seçin, HEX/RGB/HSL arasında dönüştürün ve uyumlu paletler oluşturun.

Yüklendikten sonra çevrimdışı çalışır
HEX
HSV
h217°
s76%
v96%
yalnızca görüntüleme

RGB

r
g
b

HSL

H
S
L

Daha fazla biçim

HEX8#3b82f6ff
RGBrgb(59 130 246)
HWBhwb(217 23% 4%)
CMYKcmyk(76%, 47%, 0%, 4%)
OKLCHoklch(62.3% 0.188 259.8)
SwiftUIColor(red: 0.231, green: 0.510, blue: 0.965, alpha: 1)
Android0xFF3B82F6
FlutterColor(0xFF3B82F6)

WCAG kontrastı

En yakın adlandırılmış renk: dodgerblue · Burada siyah metin daha okunaklı (5,71:1)

Beyaz üzerindeki metin3,68:1AA büyük
Siyah üzerindeki metin5,71:1AA
#ffffff üzerinde metin3,68:1AA büyük

Tonlar ve açık tonlar (50–950)

Renk paleti

Tamamlayıcı

#3b82f6
#f6af3c

Üçlü

#3b82f6
#f63c83
#83f63c

Analog

#3ce0f6
#3b82f6
#523cf6

Monokromatik

#073c92
#0a5adb
#3b82f6
#85b2f9
#cee0fd

Yaygın kullanımlar

  • Web Tasarımı için Renk SeçiciWeb siteniz için renkler seç ve oluştur — HEX, RGB ve HSL değerlerinin yanı sıra uyumlu paletler al.
  • Branding için Renk SeçiciMarka renk paletini oluştur — birlikte çalışan birincil, ikincil ve vurgu renklerini seç.
  • Sosyal Medya için Renk SeçiciSosyal medya yazıları, hikayeleri ve profil tasarımları için göz kamaştırıcı renk paletleri oluştur.
  • Baskı Tasarımı için Renk SeçiciBaskılı materyallar için renkler seç — broşürler, kartvizitler, el ilanları — doğru renk önizlemeleriyle.
  • Sunumlar için Renk SeçiciSlaytlar için renk şemaları tasarla — okunabilir metin renkleri, grafik paletleri ve tutarlı vurgu tonları seç.

Nasıl çalışır

Her şey elle yazılmış dönüştürme matematiğiyle doğrudan tarayıcınızda çalışır — renk kütüphanesi yok, sunucuya gidiş-dönüş yok. Tarayıcının yerel renk girişiyle veya EyeDropper API ile bir renk seçersiniz; araç onu anında altı biçime dönüştürür, ayrıca WCAG kontrast oranlarını hesaplar ve uyum paletleri üretir.

  1. 1
    Yerel API ile renk girişi
    Bir rengi tarayıcının yerleşik <input type="color"> bileşeniyle seçersiniz veya — Chromium tabanlı tarayıcılarda — EyeDropper API ekranınızdaki herhangi bir pikseli örneklemenize izin verir. İki yol da tek doğruluk kaynağı olan bir onaltılık dize döndürür.
  2. 2
    Elle yazılmış biçim dönüştürmeleri
    Araç onaltılık değeri kendi matematik işlevleriyle (harici kütüphane olmadan) RGB, HSL, HSV, CMYK ve OKLCH'ye dönüştürür. OKLCH dönüştürmesi sRGB kanallarını doğrusallaştırır, OKLab küp kök matrisini uygular, ardından kroma ve ton açısını türetir — modern CSS Color Level 4 çıktısıyla eşleşir.
  3. 3
    WCAG kontrast oranı hesaplama
    Göreli parlaklık, WCAG 2.x formülü kullanılarak doğrusallaştırılmış RGB kanallarından hesaplanır. Araç ardından saf beyaz ve saf siyaha karşı kontrast oranlarını hesaplar ve bunları WCAG eşiklerine (3:1, 4.5:1, 7:1) göre AA-büyük, AA, AAA veya Başarısız olarak etiketler.
  4. 4
    Uyum paleti oluşturma ve yerel kaydetme
    Tamamlayıcı, üçlü, analog ve tek renkli örnekler, HSL ton ve açıklık değerleri matematiksel olarak döndürülerek veya adım adım kaydırılarak türetilir. Kaydedilen paletler tarayıcınızdaki localStorage'a yazılır — hiçbir şey cihazınızdan çıkmaz.

İlgili araçlar

🎨

Rastgele Renk Üretici

Rastgele renkleri tek tek veya beşli bir palet olarak üretin, beğendiklerinizi kilitleyin, HEX, RGB veya HSL değerlerini kopyalayın ve paleti PNG ya da CSS olarak dışa aktarın.

Deneyin
🎨

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.

Deneyin
🎨

Görüntü Renk Paleti Çıkarıcı

K-ortalama renk niceleme kullanarak herhangi bir görüntüden baskın renkleri çıkarın. Fotoğrafınızdaki veya logonuzdaki ilk 2-16 rengin hex kodlarını alın.

DeneyinDosyalar yerel kalır

Sık sorulan sorular