Split a PNG into HSL Channels
Convert an image into its HSL components — Hue, Saturation, and Lightness — each saved as a grayscale PNG. HSL describes colour the way people tend to think about it: what colour, how vivid, how bright. Drop a file and download all three channels as a ZIP, processed in your browser.
Drop images here
Multiple files allowed · one ZIP per image
What each channel is
- Hue — the colour itself, mapped around the wheel (0–360°) and scaled to gray.
- Saturation — how vivid vs. gray the colour is; white = fully saturated.
- Lightness — how light or dark; white = white, black = black, mid-gray = a pure mid colour.
When HSL is the right model
HSL is handy when you want to select or adjust by colour rather than by red/green/blue mix — isolating everything of a certain hue, or building a saturation-based mask. The Lightness channel also makes a decent quick grayscale.
FAQ
What's the difference between HSL and HSV?
Both share the Hue and Saturation idea, but HSL's third channel is Lightness (0 = black, 1 = white, 0.5 = pure colour) while HSV's is Value (brightness, 1 = brightest). They suit slightly different selection tasks.
Why is the Hue channel banded / abrupt?
Hue is an angle that wraps around at 360° back to 0°, so red appears at both ends of the gray range — a visible seam, not an error.