HSV Color Picker

How to use the HSV color picker

1. Pick your hue first to land on the right color family, from red through green to blue.
2. Drag saturation down to calm a color or up to make it pop, depending on whether you want a subtle background or an eye-catching accent.
3. Set the value to control brightness, lowering it for a deep, shadowy shade or raising it for a bright, lively one.
4. Copy the HSV code, or switch the readout to grab the same color as HEX or RGB for the web.

What is an HSV color?

HSV sets a color by hue, saturation and value, written like hsv(210, 88%, 100%). It is the model under most painting and design app color wheels, because value acts like a brightness dial running from pure black up to the fullest version of the hue.

Meaning of each value in an HSV color

What HSV is good for

• Digital painting, where you pick a pigment-like hue then darken it with value or mute it with saturation, exactly how mixing paint feels.
• Image and photo editing, since the familiar square-plus-slider control found in most editors is built directly on saturation and value.
• UI accents like highlights, status dots and chart keys that need a clean hue kept at full brightness.
• Building shade ranges from one color by holding the hue steady and only moving value up and down.

Difference between HSL, HSV and HSB

HSV and HSB are the same model: the B in HSB just stands for brightness, which is another word for value, so any HSB picker behaves identically to an HSV one. HSL is the close cousin that swaps value for lightness. The practical difference is what happens at the top of that third slider: in HSL, pushing lightness to 100% always gives white, while in HSV pushing value to 100% gives the most vivid version of the hue and never adds white. Because of that, HSL is popular on the web for quickly making lighter and darker tints of a brand color, while HSV (HSB) is the default in painting and design apps where you want to keep a color saturated as you brighten it.

When you need the result back in a web format, send it through the Color Converter for HEX or RGB.

Why artists prefer HSV

For anyone coming from painting rather than code, HSV simply feels right. Picking a pure hue and then pulling it darker with value or softer with saturation mirrors mixing real pigment. HSL suits UI work, but for illustration and image editing HSV is the more natural tool.