HSL vs HSV in color pickers — what is the difference between saturation, lightness, and value (brightness)?
Both use hue 0–360°, but HSL’s third axis is lightness (mix with gray), while HSV’s third axis is value (max channel brightness). The same RGB can yield different HSL and HSV numbers; wheels that feel “brighter toward the edge” are usually HSV-style.
Detailed answer
HSL (hue, saturation, lightness) moves toward white/black by changing lightness while holding hue. HSV (hue, saturation, value) keeps “full color” at the edge of the wheel when value is high. Our Color Picker shows both so you can match CSS hsl() and tools that label HSB/HSV. Dedicated pages convert between every pair with visible math.
Relationship context
Neither HSL nor HSV is wrong—they are different cylindrical views of sRGB. Integer rounding can make reverse conversions differ by ±1 from a picked HEX.
Example sRGB codes (HEX · RGB · HSL)
More Color Picker tools
Open the main picker or a fixed input/output converter—same math as the hub, with copy-ready strings.