Advertisement


Color Theory: Is there a measurement of "colorfulness"?


Question

I was adding some colors to a Windows application. A column was going to be colored in order to indicate groupings to the user. So in Photoshop i first selected some colors to use. Being mathematically (rather than graphically) inclined, i chose to use the hue from every 60 degrees:

enter image description here

Note: This question is going to be about color theory; and less about graphic design or usability.

Since i was going to have to have Black text (e.g. 13 of 27) over top these colors, i needed them to be fairly light. I know that the L value in Photoshop refers to the human's intrinsic sense of how "light" the color is. I chose a Luma of 90. So with more fiddling in Photoshop i adjusted the L of each color so each had a Luma of 90.

enter image description here

Note: i'm going to use L, or Luma interchangeable. i know there are precise, and separate, definitions for L, L*, Luma, Luminance, brightness, and lightness. Some definitions may be precise, some not. Lets avoid that holy war and just know that i'm using the L thing in Photoshop. And lets assume that two colors with the same L in photoshop will have the same apparent "brightness", or "lightness" to them. Again, forgive brightness and lightness. Yes, i'm inadequate.

As i change the L value, the Hue would change. So it was juggling act. Adjust the L, fudge the hue back to the value i want, adjust up the L, fudge the hue back, fudge the L, fudge the hue:

enter image description here

Eventually i get the hue i want to have the L i want.

But what saturation?

The code i was updating also used "gray" as one of the colors that could be shown to the user. I realized that grey doesn't fit into any of my hues. Intrigued, i added to my photoshop doodle. It's simply a "saturation" of zero (which is the S knob in Photoshop):

enter image description here

So then the question dawned on me. I decided to use a Luma=90 for all my colors. This means that visually/psychologically/perceptually all the colors would be equally "bright". I've pinned down a Hue i want, and i've pinned down a Luma i want. But what Saturation do i want?

Ideally, and i don't know if this is a thing, they could all be equally "colorful". i don't want them to all be gray, i want them more colorful than that. And i want them to all the the same "colorfullness" - if that's a word.

So i did what anyone would do, i googled wikipedia colorfullness, and there's an entry:

In colorimetry and color theory, colorfulness, chroma, and saturation are related but distinct concepts referring to the perceived intensity of a specific color.

  • Colorfulness is the degree of difference between a color and gray.
  • Chroma is the colorfulness relative to the brightness of another color that appears white under similar viewing conditions.
  • Saturation is the colorfulness of a color relative to its own brightness.

Though this general concept is intuitive, terms such as chroma, saturation, purity, and intensity are often used without great precision, and even when well-defined depend greatly on the specific color model in use.

And then the article devolves into CIE, Lab, Luv. And i don't know what i want.

I went back to Photoshop, and started to just increase the "saturation" knob of each color. For a given hue, and the fixed luma, i increased the saturation in 5% increments (having to do fiddling along the way):

enter image description here

But at some point, the colors cannot "saturate" anymore without losing Luma:

enter image description here

And some colors can reach all the way to the end with S=100 and L=100:

enter image description here

Which brings me to my question

In the same way the Luma defines the perceived "lightness" of a color:

is there a metric for the perceived "colourfulness" of a color?

Is there such a metric? Is the Saturation in Photoshop's HSB color model a perceptual one?

i noticed one snippet in the wikipedia article that's easy enough for me to understand: use the hypotenuse of a and b:

enter image description here

i could do that, and figure out which of my color chips have the same "Chroma".

Bonus Chatter

In the end, in the real application, i used a color wheel centered around blue 210, and avoided green (in case the user things green means good), and use complimentary colors as much as possible.

enter image description here

But i still want to know about the color theory of "colorfullness".

Bonus ab length

Assuming the magnitude of an ab vector in Lab color model, i.e.:

  • colorfulness = Sqrt(a2 + b2)

i calculated the chroma lengths of various colors:

enter image description here

Colors of different hues with approximately the same "chroma lengths" look to me like they have the same "colorfulness". If nothing else comes up, i might go back and recalculate all my existing constants using this formula.

Otherwise it will nag at me.

2014/01/12
1
8
1/12/2014 12:57:00 AM

Accepted Answer

After doing a lot of reading, turns out there is a useful metric of "colorfulness".

The hint came from the wikipedia page i cited, which mentions the L*C*h* color space. The L*C*h* is a variation of the L*a*b* color space.

Take the Lab color space you are used to from Photoshop:

enter image description here

Where a and b are cartesian coordinates:

But you can also represent colors on that plane using polar coordinates.

Rather than a pair of cartesian coordinates:

  • a and b

enter image description here

coordinates, it can be a pair of polar coordinates

  • C* and h

enter image description here

So that C* is a measure of Chroma and h is a hue angle.

The formula to convert a, b into a C* length is high school pytheogrean theory:

enter image description here

The defined hue angle doesn't quite match the HSL/HSB hue angle. But it works out well enough to base a color model off it:

enter image description here

But Colorfulness

But the jist of what i learned is that the distance from the center (a=0, b=0) makes the color more colorful.

I also learned that some colors in the Lab color picker are outside the human ability to perceive as color; and so are not actually colors. There is a GiMP LCh color picker, and it points out the colors that are out of human gamut:

enter image description here

2014/01/13
2
1/13/2014 7:20:00 PM

The correct word for strength of colour is chroma when talking about objects, and colorfulness when talking about light/overall appearance, as in, a high-chroma red ball presents a colorful appearance/gives off colorful light when it is brightly lit, and presents a less colorful appearance/gives off less colorful light when it is sitting in shadow.

The term chroma was first introduced in the Munsell system (1905-), where it is measured in Munsell chroma units. Your ab vector is the analogous measure in Lab space, and is called chroma (C) in LCH (or Lch or L*c*h*), which is a quite widely used alternative way of presenting Lab values. It's the most convenient metric for chroma for RGB colours, although if you wanted to it would be possible to convert from sRGB to Munsell chroma by consulting a lookup table or by using some software that did that for you.

Graphic designers often seem to use the word saturation as if it meant basically the same thing as chroma, but that's not what it means in HSV/Photoshop HSB, where it effectively means chroma/colorfulness relative to brightness, as in the definition you quoted above. You might like to look at my Figure 1.2.5 on this page to see the relationship between HSB saturation and chroma: http://www.huevaluechroma.com/012.php

David Briggs The Dimensions of Colour http://www.huevaluechroma.com

2014/01/13