Renk Seçici ve Palet Tasarımcısı

Bir renk seçin, formatlar arasında dönüştürün, WCAG kontrastını kontrol edin ve uyumlu paletler oluşturun.

RGB Controllers
R: 34
G: 197
B: 94
HSL Controllers
H: 142°
S: 71%
L: 45%
HEX#22C55E
RGBrgb(34, 197, 94)
HSLhsl(142, 71%, 45%)
CMYKcmyk(83%, 0%, 52%, 23%)
CSSbackground-color: #22C55E;

WCAG 2.1 Kontrast ve Okunabilirlik Kontrolü

Beyaz arka planda kontrastKontrast Oranı: 2.28:1
Normal Metin (AA)KALDI
Normal Metin (AAA)KALDI
Büyük/Kalın Metin (AA)KALDI
Büyük/Kalın Metin (AAA)KALDI
Siyah arka planda kontrastKontrast Oranı: 9.22:1
Normal Metin (AA)GEÇTİ
Normal Metin (AAA)GEÇTİ
Büyük/Kalın Metin (AA)GEÇTİ
Büyük/Kalın Metin (AAA)GEÇTİ

Renk Uyum Şemaları

Tamamlayıcı Uyum
#22C55E
#C42188
Benzer Uyum
#37C421
#22C55E
#21C4AE
Üçlü Uyum
#5D21C4
#22C55E
#C45D21
Tek Renkli Tonlar
#0B411F
#16833E
#22C55E
#51E186
#92EDB3
26.176 görüntülenmeVerileriniz tarayıcınızda işlenir, sunucuya hiçbir şey gönderilmez.

İlgili araçlar

JSON Biçimlendirici
JSON'u çevrimiçi doğrula, güzelleştir ve küçült. Her şey tarayıcında çalışır — ücretsiz ve gizli.
Base64 Çevirici
Base64 metnini tarayıcında anında kodla veya çöz. Ücretsiz ve gizli.
URL Encode
URL ve sorgu dizelerini tarayıcında anında kodla veya çöz. Ücretsiz ve gizli.
JWT Çözücü
JSON Web Token (JWT) başlık ve veri yükü alanlarını tarayıcınızda anında çözün. Ücretsiz, gizli, imza doğrulaması yapmaz, sunucuya veri gönderilmez.

Bu aracı tanıyalım

Renk Seçici, tarayıcınızın yerleşik renk seçme penceresiyle bir renk seçmenizi ve HEX, RGB, HSL değerlerini tasarımlarınız ve kodunuz için anında okumanızı sağlar.

Renk Seçici (Color Picker) Nedir?

Renk Seçici, tasarımcılar, web geliştiriciler ve grafik sanatçıları için renk kodlarını manuel olarak hesaplama zahmetinden kurtaran küçük ama pratik bir araçtır. Renk örneğine tıkladığınızda tarayıcınızın yerleşik renk seçme penceresi (<input type="color"> ile aynı pencere) açılır; seçtiğiniz renk anında HEX, RGB ve HSL formatlarına çevrilir.

Öne Çıkan Özellikleri

  • Yerleşik Renk Seçici: Renk örneğine tıklayarak tarayıcınızın kendi renk seçme penceresini açın; bu pencerede renk yelpazesi, ton/doygunluk alanı ve (çoğu tarayıcıda) ekrandan renk örnekleyen bir damlalık bulunur.
  • Çoklu Renk Formatı Desteği: Seçtiğiniz rengin en sık kullanılan formatlardaki değerlerini anında görüntüler:
    • HEX: Web geliştirmede ve CSS'te en yaygın kullanılan altı haneli onaltılık kod (Örn: #22C55E).
    • RGB: Kırmızı, Yeşil ve Mavi oranlarını temsil eden format (Örn: rgb(34, 197, 94)).
    • HSL: Renk Tonu, Doygunluk ve Açıklık değerlerine dayanan modern tasarım formatı (Örn: hsl(142, 71%, 45%)).
  • Canlı Renk Örneği: Seçtiğiniz renk, örnek kutusunu anında doldurur; ne seçtiğinizi her zaman net görürsünüz.
  • Tek Tıkla Kod Kopyalama: Her formatın yanındaki kopyalama düğmesiyle ilgili kodu tek tıkla panonuza alabilirsiniz.
  • Tarayıcı Tabanlı ve Hızlı: Tamamen tarayıcınızda yerel olarak çalışır, kurulum gerektirmez ve hiçbir veri sunucuya gönderilmez.

Nasıl Kullanılır?

  1. Renk örneğine tıklayarak tarayıcınızın yerleşik renk seçme penceresini açın.
  2. Renk yelpazesi, kaydırıcılar veya (varsa) tarayıcınızın damlalık özelliğiyle bir renk seçip onaylayın.
  3. Alt kısımdaki HEX, RGB ve HSL değerlerinin anında güncellendiğini görün.
  4. İhtiyacınız olan formatın yanındaki kopyalama simgesine tıklayın.
  5. Kopyaladığınız kodu CSS dosyanıza, tasarım aracınıza veya kodunuza yapıştırın.

Sıkça Sorulan Sorular

HSL ve RGB arasındaki fark nedir?

RGB formatı, bir rengin ne kadar Kırmızı (Red), Yeşil (Green) ve Mavi (Blue) ışık barındırdığını belirtir. HSL ise Renk Tonu (Hue - 0-360 derece), Doygunluk (Saturation - %) ve Parlaklık (Lightness - %) değerlerini kullanır. HSL, bir rengi daha koyu veya daha açık yapmak gibi düzenlemeleri insan gözü için daha sezgisel hale getirir.

HEX kodu nedir?

HEX (Hexadecimal), web tasarımında en çok kullanılan renk formatıdır. # işaretiyle başlar ve ardından gelen 6 hane, RGB renk bileşenlerinin onaltılık sayı sistemindeki karşılıklarını ifade eder.

#fff gibi kısaltılmış HEX kodları desteklenir mi?

Evet. Üç karakterli kısaltılmış HEX değerleri, dönüştürme yapılmadan önce otomatik olarak altı karakterli tam haline genişletilir.