Color node
Color to HSL
Decompose any color into its Hue, Saturation, Luminosity, and Alpha components (all normalized 0 -- 1). This is the inverse of the HSL Color node and is useful for color analysis, conditional logic based on hue ranges, or feeding individual perceptual channels into other nodes.
Inputs
| Port | Type |
|---|---|
| ColorThe colour to break apart into hue, saturation, luminosity and alpha. Hue, saturation and luminosity all come out in the 0…1 range, and a fully grey input reports hue 0. | color |
Outputs
| Port | Type |
|---|---|
| Hue | float |
| Saturation | float |
| Luminosity | float |
| Alpha | float |
How It Works
Color to HSL converts the incoming RGBA color into the HSL color model by extracting three perceptual properties:
- Hue identifies "what color" it is on the circular color wheel, normalized to 0 — 1. Pure red = 0, pure green = 0.333, pure blue = 0.667, and the value wraps back to red at 1.0.
- Saturation measures how vivid or muted the color is. A fully saturated color has maximum chromatic intensity; a desaturated color appears gray.
- Luminosity measures perceived lightness. Black = 0, the purest expression of any hue = 0.5, white = 1.
For achromatic colors (grays, black, white), Hue is 0 and Saturation is 0. Only Luminosity varies.
Use Cases
- Hue-based branching — Use Compare nodes on the Hue output to detect whether a color is in the "warm" range (0 — 0.15 or 0.85 — 1.0) or "cool" range (0.4 — 0.7).
- Saturation filtering — Detect desaturated regions (Saturation < 0.1) for conditional effects.
- Brightness extraction — Use the Luminosity output as a simple brightness measure to drive other parameters (e.g. particle spawn rate proportional to scene brightness).
- Color analysis — Decompose a dynamically generated color to display its HSL values in a UI Text overlay for debugging.
- Hue shifting — Decompose with Color to HSL, add an offset to Hue using a Math node, then recompose with HSL Color to shift colors around the wheel.
Tips
- The Hue output is circular: values near 0 and values near 1 are both red. When computing hue differences, account for this wraparound.
- For pure white, pure black, or any shade of gray, Saturation will be 0 and Hue will be 0 (undefined). This is expected.
- Pair with HSL Color for a decompose-modify-recompose workflow.
- To decompose into RGB channels instead, use the Color to RGB node.
Open Color to HSL in the interactive catalog →
Color to HSL is one of 381 nodes in Grafit Pro.
Free download. Every feature for 7 days, no card. Then €99.99 once — or keep playing your projects as a Player.