What is Color? Hue, Saturation, and Value Explained

Color is the visual byproduct of light - wavelengths reflected from a surface or transmitted through a medium and processed by your eye. Every color on a screen, in a print, or in nature can be described using three integral components: hue, saturation, and value.

Hue

Hue is the dominant wavelength - the "name" of the color, like red, yellow, or cyan. It is what you mean when you say a color is purely itself, with no white, black, or grey added. On a color wheel, hue is the angle, traveling 0–360° around the circle.

Value (Brightness / Lightness)

Value describes how light or dark the color is - the quantity of light reflected. Adding white to a hue creates a tint, adding black creates a shade, and adding grey creates a tone.

Saturation (Chroma / Intensity)

Saturation defines the brilliance and purity of the color. A 100% saturated red is a vivid, electric red; desaturating it pulls it toward grey. On the HSV cone, saturation is the distance from the central grey axis outward to the pure hue.

The HSV Cone

Imagine an inverted cone. The top circle holds every fully-bright hue at 360°; the central vertical axis is the grayscale ramp from black at the tip to white at the top; and saturation is the horizontal distance outward. This single 3D model powers every modern color picker, from Adobe to your favorite design tool.

Why It Matters for Designers

Treating color as three independent dials gives you precise creative control. Want the same palette to feel calmer? Lower saturation. Want the brand to look premium? Drop the value to deepen the hues. Want a sunny rebrand? Lift saturation and value together.

Try it yourself in our Color Picker - slide the hue, saturation, and value rings independently and watch the color shift across HEX, RGB, HSL, LCH, OKLCH, and LAB in real time.