The HSB (or HSV) and HSL color models are transformations of the RGB color model that arrange colors in a way more intuitive to artists. These two color models are very similar but have some important differences.

HSB stands for hue, saturation, and brightness: the three axes of the color model. Brightness is sometimes refered to as value (V) and means the same thing. HSL stands for hue, saturation, and luminance. Luminance differs from brightness and will be explained shortly.

Hue is the same in both models and is represented as an angle around a circle, or sometimes, a hexagon. Red is typically placed at 0°, yellow at 60°, green at 120°, cyan at 180°, blue at 240°, and magenta at 300°, finally wrapping back around to 0°, or red. Some computer programs may represent this angle differently, such as a value from 0–255 or 0.0–1.0. Technically, hue is defined as the dominant wavelength of a color. E.g. a color could be said to be mostly orange, or more orange than green, blue, or any other color.

Saturation (also called chroma) refers to the purity of the color. A fully saturated red is a bright, fire engine red, whereas a less saturated red might resemble pink or terra cotta. This dimension measures from the center of the circle (no saturation) to the outer edge (fully saturated).

Brightness is the intensity of a color. Dark colors are at the bottom of the color model and bright, vivid colors are at the top. Colors at maximum brightness at the outer edge are the most saturated. Darker colors are, by necessity, less saturated. While this color model is usually constructed as a cylinder, an inverted cone is more accurate. With a cone, as brightness decreases, the available range of saturation decreases down to the tip where the color is black and completely desaturated. Every point within the cone is a unique HSB color.

	HSB cylindrical and conical models. Hue is the angle around the center, saturation is the distance from the center outward, and brightness is the vertical dimension. Circles show sections at 100%, 50%, and 0% brightness. (Wedges removed for illustration purposes)

Luminance is a bit different than brightness. It can also be called lightness. In HSL, the most saturated colors are along the outer edge with a 50% luminance level. That is, they lie along the equator of the cylinder or double-ended cone (shown below). Colors above this line become increasingly white, and therefore, less saturated. Colors below the line become increasingly black, and thus also less saturated. The double cone model properly reflects this reduction in saturation range.

	HSL cylindrical and double-conical models. Dimensions are similar to HSB, but the highest saturation point is around the middle of the lightness axis instead of at the top. From this "equator" up grows increasingly white, while from there down becomes increasingly black. Green and yellow are located at the rear of these figures.

In both HSB and HSL the center vertical line represents shades of gray with white at the top and black at the bottom. From the center to the edge is a smooth gradation from the level of gray at that brightness or luminance level out to the saturated color at the edge. The diagrams above show wedges cut out of the color models so this gradation can be seen.

Regardless of which color model is used, both tend to be more meaningful to artists than RGB or CMYK. For instance, it's very easy to find a color's compliment by simply crossing over to the opposite side of the circle. Yellow is directly across from blue, green across from magenta, and red across from cyan. Darkening a color means adjusting one value, the brightness or luminance. With RGB it means scaling down each axis proportionately, which is difficult to do without accidentally altering the hue and saturation. Being able to select several colors at the same brightness or saturation is more important in design than picking colors with the same level of the green channel.

Most graphics applications have one or both of these color models in their color pickers. Photoshop, for example, includes HSB.