Renk seçiciye geç

HSL → HEX dönüştürücü

Bir HSL değeri yapıştırın, HEX karşılığını anında alın. Diğer formatlar da çalışır.

Algılanan: HSL

HEX değeri#ff5733
HEX → HSL

Rengi ayarla

11°
%100

%68
0,210
34°

Diğer tüm formatlar

HSL → HEX örnekleri

RenkHSLHEX
hsl(0, 100%, 50%)#ff0000
hsl(120, 100%, 50%)#00ff00
hsl(240, 100%, 50%)#0000ff
hsl(0, 0%, 100%)#ffffff
hsl(0, 0%, 0%)#000000
hsl(0, 0%, 50.2%)#808080
hsl(10.59, 100%, 60%)#ff5733
hsl(217.22, 91.22%, 59.8%)#3b82f6
hsl(160.12, 84.08%, 39.41%)#10b981
hsl(37.69, 92.13%, 50.2%)#f59e0b
hsl(258.31, 89.53%, 66.27%)#8b5cf6
hsl(330.37, 81.19%, 60.39%)#ec4899

HSL ve HEX hakkında

HSL, renk özünü derece, doygunluk ve açıklığı yüzde olarak tanımlar. Okuması kolaydır ama açıklığı algıya göre eşit değildir: %50’deki sarı, %50’deki maviden çok daha açık görünür.

HEX; kırmızı, yeşil ve maviyi ikişer onaltılık basamakla yazar, örneğin #ff5733. Web’de ve tasarım araçlarında renk yazmanın en yaygın yoludur.

Dönüştürme nasıl çalışır

HSL değerini okuyup CSS Color 4 spesifikasyonundaki matrislerle CIE XYZ’ye, oradan da HEX formatına çeviriyoruz. Hedef gamın dışında kalan değerler, açıklığı ve renk özünü koruyup kromayı azaltan CSS Color 4 algoritmasıyla gama sığdırılır.

Sorular ve yanıtlar

HSL değerini HEX formatına nasıl dönüştürürüm?

Yukarıdaki alana bir HSL değeri yapıştırın veya yazın. PickShade siz yazarken değeri CSS Color 4 formülleriyle dönüştürür, HEX değerini de tek tıkla kopyalarsınız.

HSL → HEX dönüşümü kesin mi?

Hesaplama kesindir; sonuç yalnızca gösterim için yuvarlanır ve aynı renge geri dönüştürmeye yetecek kadar basamak içerir. Renk hedef gama sığmıyorsa PickShade sizi uyarır ve sığan en yakın rengi gösterir.

Aynı anda başka formatları da alabilir miyim?

Evet. OKLCH, Display P3, Tailwind, SwiftUI, Flutter ve Android dahil diğer tüm formatlar sonucun altında listelenir ve tek tıkla kopyalanır.

Bu dönüştürücü ücretsiz mi?

Evet. Ücretsizdir, üyelik gerektirmez ve tamamen tarayıcınızda çalışır.