Renk Dönüştürücü — HEX, RGB, HSL
Üç gösterimden herhangi biriyle bir renk yapıştırın, diğerlerini alın; alfa dâhil ve neyi dönüştürdüğünüzü görebileceğiniz bir renk örneğiyle.
Renk
Gösterimler
Bu araç hakkında
Hex bir tasarım aracının size verdiği biçimdir, rgb() bir canvas ya da görüntü kitaplığının istediğidir, hsl() ise bir rengi biraz açmak veya ton döndürmek istediğinizde başvurduğunuzdur. Bunlar arasında elle çevirmek kimsenin sevmediği bir aritmetiktir. Üçünden birini — alfalı ya da alfasız — yapıştırın, diğerleri belirsin; yanında bir renk örneğiyle, çünkü tek başına bir değeri yanlış yazmak kolay, gözle denetlemek zordur.
Nasıl kullanılır
- 1Bir renk yapıştırın: #3fb984, rgb(63 185 132) veya hsl(157, 49%, 49%).
- 2Sağdaki diğer gösterimleri okuyun ve üstlerindeki renk örneğini denetleyin.
- 3İhtiyacınız olan satırı ya da hazır CSS özel özelliğini kopyalayın.
Sık sorulan sorular
›Hangi gösterimleri yapıştırabilirim?
3, 4, 6 veya 8 basamaklı hex (#3fb, #3fb9, #3fb984, #3fb984cc), rgb() ve rgba(), ayrıca hsl() ve hsla(). Hem virgüllü sözdizimi hem de alfadan önce eğik çizgi koyan modern boşluklu sözdizimi kabul edilir.
›HSL neden ondalıklı dönüyor?
Çünkü ton, doygunluk ve açıklık sürekli değerlerken hex kanal başına 8 bittir. Hex’i HSL’ye çevirmek nadiren tam sayıya oturur ve yuvarlamak, geri dönüşte rengi biraz kaydırır.
›Dördüncü hex çifti ne işe yarar?
Alfa. #3fb984cc, aynı rengin %80 opaklıktaki hâlidir. Artık önemli olan her yerde desteklenir ve rgba()’ya geçmekten kısadır.
›«tomato» gibi adlandırılmış renkler destekleniyor mu?
Hayır. 148 CSS anahtar sözcüğünü çözmek çok az yarar için tüm tabloyu gerektirir — bunun yerine hex değerini yapıştırın. Herhangi bir tarayıcı geliştirici paneli size verir.
›Tasarımcılar neden sürekli OKLCH’ten söz ediyor?
Çünkü HSL açıklığı algılanan parlaklıkla örtüşmez: aynı L değerine sahip iki renk çok farklı görünebilir. OKLCH bunu düzeltir ve palet kurmak için çok daha uygundur. Bu sayfa her gün yapıştırdığınız üç gösterimde kalır.