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

Tek renk, tüm formatlar

Tasarım araçları, CSS, marka kılavuzları ve kod kütüphaneleri renkleri farklı şekillerde tanımlar. Tasarımcı size #8997BB verir, grafik kütüphanesi rgb(137, 151, 187) ister, siz de daha açık bir ton üretmek için HSL değeri istersiniz. Bu renk dönüştürücü yaygın formatlardan herhangi birindeki rengi alır ve diğer tüm formatlarda gösterir.

Kabul edilen formatlar: HEX (#8997BB), alfa kanallı HEX (#8997BBCC), RGB, RGBA, HSL, HSLA ve HSV. Birini yapıştırın, ihtiyacınız olan sürümü kopyalayın.

Kısa rehber: HEX ve RGB kırmızı, yeşil ve mavi ışık miktarlarını tanımlar. HSL ise ton (renk çarkındaki konum, 0–360°), doygunluk ve açıklığı tanımlar; bu da açık ve koyu tonlar üretmeyi kolaylaştırır. HSV (HSB olarak da bilinir) birçok tasarım uygulamasındaki renk seçicilerin kullandığı modeldir. "A" ile biten sürümler şeffaflık için alfa kanalı ekler.

Renk dönüştürücü nasıl kullanılır?

1. Desteklenen herhangi bir formatta bir renk girin, örneğin #8997BB, rgb(137,151,187) veya hsl(223, 27%, 63%).
2. Dönüştürmek için gönderin.
3. Sonuçlardan ihtiyacınız olan formatı kopyalayın.
4. CSS’inize, tasarım dosyanıza veya kodunuza yapıştırın.

Sık kullanım alanları

• Marka kılavuzundaki renkleri CSS değerlerine çevirmek.
• Bir kaplamaya veya gölgeye şeffaflık eklemek için RGBA veya HSLA değerleri almak.
• Hover durumları için bir marka renginin açık ve koyu varyasyonlarını HSL ile oluşturmak.
• Figma, Photoshop, Canva ve kod arasında renkleri eşleştirmek.
• Farklı kaynaklardan gelen iki değerin gerçekten aynı renk olup olmadığını kontrol etmek.

İpuçları ve bilinmesi gerekenler

• Üç haneli HEX kısaltmadır: #ABC, #AABBCC ile aynıdır.
• Sekiz haneli HEX’te son iki hane alfadır: FF tamamen opak, 00 tamamen şeffaftır; 80 yaklaşık %50’dir.
• HSL ve HSV, ikisi de ton ve doygunluk kullansa da aynı değildir. Yapıştıracağınız araç hangisini istiyorsa onu kullanın.
• Okunabilirliği kontrol edin: metnin arka planla yeterli kontrastı olmalıdır (WCAG normal metin için en az 4,5:1 önerir).
• Rengi görsel olarak seçmek için renk seçiciyi kullanın. Tek bir dönüşüm için HEX’ten RGB’ye veya RGB’den HEX’e araçlarını deneyin.

Sıkça sorulan sorular

HEX renk kodu nedir?

HEX kodu, önünde # bulunan altı haneli onaltılık bir sayıdır. Her hane çifti kırmızı, yeşil ve maviyi 00 (hiç) ile FF (tam) arasında belirler; yani #FF0000 saf kırmızıdır.

RGB ile RGBA arasındaki fark nedir?

RGBA dördüncü bir değer ekler: 0 (şeffaf) ile 1 (opak) arasında alfa. rgba(0, 0, 0, 0.5), %50 opaklıkta siyahtır.

Neden HEX yerine HSL kullanmalı?

HSL insanlar için ayarlaması daha kolaydır. Yalnızca açıklık değerini değiştirerek aynı tonun daha açık veya koyu sürümlerini elde edersiniz; renk paleti oluştururken çok kullanışlıdır.

HSV ile HSB aynı şey mi?

Evet. HSB (ton, doygunluk, parlaklık), HSV’nin (ton, doygunluk, değer) diğer adıdır.

CSS bu formatların hepsini kullanabilir mi?

Modern tarayıcılar HEX, alfa kanallı HEX, rgb(), rgba(), hsl() ve hsla() formatlarını CSS’te doğrudan destekler. HSV bir CSS formatı değildir, önce dönüştürün.

İlgili araçlar

• Renk seçici: Renk çarkından renk seçip sonucu her formatta almanın en kolay yolu.
• HEX’ten RGB’ye: HEX renk birimlerini kolayca RGB’ye dönüştürün.
• RGB’den HEX’e: RGB renk birimlerini kolayca HEX’e dönüştürün.
• Resim sıkıştırma: Görselleri yüksek kaliteyi koruyarak daha küçük boyuta sıkıştırın ve optimize edin.
• Hex çevirici: Herhangi bir metni hexadecimal’e ve tersine dönüştürün.