What do Hue, Chroma, Saturation, Value, Tones, Tints, Shade, etc. mean?

Question

I've read several online tutorials about color theory but I'm still confused about how to "visually" catch color concepts and use them efficiently. The only thing I seem to understand is "hue" which is just a synonym of color, so anytime I can call something a color, I can also call it hue (correct me if I'm wrong). Here are the concepts I need to understand:

• Hue
• Chroma
• Saturation
• Value
• Tones
• Tints
• Shade
• Intensity
• Brightness
• Lightness.

Thank for you helping!

Answer 1

Don't feel bad. Color theory isn't easy.

First, many of your terms come from the many different ways to express a color. What we typically call a "color" (like, 'red' or 'orange') can be expressed in a variety of different ways:

1. RGB: The combination of red, green, and blue light that forms a color. This is also called additive color (when you add more light, you get closer to white) and is what you'll see for digital cameras, televisions, monitors, and anything that emits light in general instead of needing an external light source to illuminate it.
2. CMYK: The combination of Cyan, Magenta, Yellow, and black ink or paint that will reflect a certain color. This is also called subtractive color (when you add more ink, you get closer to black) and is what you'll see for printers or anything else that uses ink, pigments, or paint. Theoretically Cyan, Magenta, and Yellow components would be enough to make all colors, but it's cheaper and faster to use dedicated black ink for dark colors and shades of gray.

3. HSL: A way to express a color in terms of its:

   • Hue: is it red or blue or anything in between? If you consider spectrum of visible light, hue determines on which point of the spectrum the color roughly is.
   • Saturation: Is the color purely, say, red, or is it muted down with some combination of gray? Totally saturated is red, totally unsaturated is gray (or white or black, depending on the…)
   • Lightness: Is it closer to white, or closer to black?

   You can play with an HSL color picker at MothereffingHSL.

   In Photoshop and elsewhere you'll see HSB (for Brightness which is in practice the same as HSV for Value) and HSI, which are both similar but not identical to HSL. More on those differences in this Wikipedia article.

4. Lab: This is a way to plot a color based on its Lightness, amount of green or magenta (a), and amount of blue or yellow (b), a model that closely approximates human vision. With Lab, you can plot every single color that's possible in RGB and CMYK, so it's useful as an intermediate step in converting digital graphics for print.

Now, after you've got your color nailed down, your other terms:

• Tint: for a given color, make it lighter (basically, add pure white) and you'll have a tint of that original color.
• Shade: for a given color, make it darker (basically, add pure black) and you'll have a shade of that original color.
• Tones: I see "tones" used to describe ranges of discrete brightness/lightness/luminescence levels in images. You'll also see it used to describe combination of colors. Mariam-Webster gives the example of "gray walls of a greenish tone".
• Chroma: Generally this is another term for saturation or a combination of saturation and hue. The Wikipedia article on colorfulness groups chroma, saturation, and colorfulness together as loosely similar, but chroma does have a specific definition in some color spaces.
• Intensity: Could refer to the brightness of a color or the saturation (or a combination). Like a soda can could be described as intensely red, or a white point of light would be intensely bright. One quirk of human vision is the Helmholtz–Kohlrausch effect, which describes how we perceive highly saturated colors as appearing lighter

Answer 2

OK, I'll try:

Chroma - when decomposing a pixel value to components, it is possible to separate the quality of brightness or luminance (luma) of the pixel from its color contributors. These color contributors are called chroma components. Often, these are expressed as differences of the Red and Blue values from the brightness - or luma - component.

Saturation - how pure is the color (the hue). On the color space, pure hue can be mixed with white in different amounts. The less white, the more pure or saturated the hue.

Value - in HSV color space, this is an indicator of the luminance.

Tones - probably brightness variations on a specific hue.

Tint - variations in the hue, or superposition of a secondary hue on a primary hue.

Shade - the darker areas of an image.

Intensity - another word for brightness.

Brightness - how illuminating is a pixel. How much it "hurts" the eye.

Lightness - in the HSL color space, the quality of luminance of the color.