Introduction to Design Systems

Color terminology

HSL

View the source

Hue

A hue is any color on the color wheel. Variations on this hue are created by establishing a shade, tint, or tone.

Hue

Saturation

Saturation is the intensity or purity of a color.

Saturation

Luminance

Luminance is the amount of brightness, or light, in a color.

Luminance

Shade

A shade is created by incorporating black to a base hue, which darkens the color.

Shade

View the source

Tint

A tint is created by adding white to a base hue, which lightens the color.

Tint

View the source

Tone

A tone is created by combining black or white (gray) with a base hue. Tones are subtle variations of the original color.

Tone

View the source