PantoneTools

HSV'den HSL'ye

Tasarım sistemlerinde çok yönlü renk manipülasyonu için HSV renk değerlerini HSL'ye dönüştürün

Gelişmiş tasarım esnekliği için sezgisel renk modelleri arasında dönüşüm yapın

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

HSV Input

180° 360°
100%
0% 50% 100%
100%
0% 50% 100%

Örnekler için renk örneklerine tıklayın

HSL Output

hsl(0°, 100%, 50%)

HSL Values

Renk tonu

0-360° color wheel position

Doygunluk 100%

0-100% color intensity

Hafiflik 50%

0-100% brightness

hsl(0°, 100%, 50%)

Ek Formatlar

HSV Value

hsv(0°, 100%, 100%)

RGB Value

rgb(255, 0, 0)

CSS Kullanımı

color: hsl(0°, 100%, 50%);
background-color: hsl(0°, 100%, 50%);

Dönüşüm İçgörüsü

Bu canlı kırmızı, her iki renk modelinde de tam doygunluğu koruyor ancak farklı parlaklık ölçümleri gösteriyor ve bu da Değer (HSV) ile Parlaklık (HSL) arasındaki temel farkı ortaya koyuyor.

Dönüşüm Örnekleri

Canlı Kırmızı

HSV 0°, 100%, 100%
HSL 0°, 100%, 50%
Fark Hafiflik = Değerin P'si

Orman Yeşili

HSV 120°, 75%, 55%
HSL 120°, 60%, 35%
Fark Hafiflik ölçeğine göre ayarlandı

Kraliyet Mavisi

HSV 220°, 75%, 88%
HSL 220°, 70%, 55%
Fark Algı için dengeli hafiflik

Yumuşak Pembe

HSV 340°, 40%, 95%
HSL 340°, 70%, 80%
Fark HSL'de doygunluk arttı

Sönük Mor

HSV 270°, 30%, 70%
HSL 270°, 30%, 60%
Fark Hafiflik aşağıya doğru ayarlandı

Gri Ton

HSV 0°, 0%, 50%
HSL 0°, 0%, 50%
Fark Gri tonlama için aynı

Önerilen Araçlar

Bu Araç Hakkında

Bu HSV'den HSL'ye dönüştürücü, her biri farklı tasarım görevleri ve iş akışları için farklı avantajlara sahip iki sezgisel renk modeli arasında sorunsuz geçişi kolaylaştırır.

HSV (Hue, Saturation, Value) represents colors based on human perception, with Value controlling the brightness from black to full color. This makes it particularly intuitive for tasks like adjusting lightness while preserving chromatic intensity, common in interface design.

HSL (Hue, Saturation, Lightness) structures color around perceived lightness, with Lightness ranging from black through the pure color to white. This model excels at creating consistent color scales and harmonies, as equal increments in lightness produce perceptually consistent steps.

Her iki model de Ton ve Doygunluk bileşenlerini paylaşsa da, parlaklık (Değer ve Açıklık) yaklaşımları temelde farklı davranışlar yaratır. Bu dönüştürücü, görsel tutarlılığı korurken bu modeller arasında çeviri yapmak için hassas matematiksel algoritmalar kullanır ve tasarımcıların iş akışları boyunca her modelin güçlü yönlerinden yararlanmalarına olanak tanır.

Sıkça Sorulan Sorular