8 Replies Latest reply on May 26, 2011 6:16 AM by Reynolds (Mark)

# breaking up the HSL spectrum into basic colors

I've been racking my brain trying to come up with a formula that outputs a color based on the entire HSL (or HSB) spectrum.  I'm looking into having roughly 12 colors:

Red
Orange
Yellow
Gold
Green
Blue
Purple
Beige
Brown
Neutral
Grey
Black
Whites

something similar to this:

The difficult thing is figuring out the range of each color using HSL.  I've been trying to use the following link to come up with formulas, but it's proving much more difficult than I thought.

http://www.december.com/html/spec/colorhslhex6.html#0

I'm thinking something like this:

if H = 1-10, S = 10-100, L = 10-90:  Red
if H = 11-20,

This is where I get lost…oranges and browns are in the same Hue and I'm just not sure how to split up each "range" of HSL.  Does anyone have any advice on how to break up the entire HSL (or RGB) spectrum into about 12 different colors/tones?

I've searched for a chart that breaks down the entire spectrum into basic colors, but have come up short.

Any advice on the subject would be much appreciated.

• ###### 1. Re: breaking up the HSL spectrum into basic colors

Your perception of colour theory is a little off kilter. For one thing, in colour terms everything is relative. For example its impossible to separate what might be perceived as "gold', in one situation from what might be perceived as yellow in another. There will at least be massive overlap. And "Gold" is not actually a colour at all.

Does anyone have any advice on how to break up the entire HSL (or RGB) spectrum into about 12 different colors/tones?

No, thats ridiculous.

• ###### 2. Re: breaking up the HSL spectrum into basic colors

Yeah, it’s curious about »Gold«, because it would actually include surface properties like reflectivity.

But as one can buy a can of »gold color« the issue may have to do with the different uses of the word »color«.

»Neutral« and »Grey« – what’s that difference supposed to be?

bsnyder175, may I ask what ultimate purpose you are trying to achieve?

Is it about image analysis or separation or …?

• ###### 3. Re: breaking up the HSL spectrum into basic colors

It's just for an image analysis tool to help catagorize a very large sum of textures by color (using average pixel color).  There's very little variation of color within the textures.  Right now, the HSL gets pulled, but doesn't get catagorized by a general color yet.  Here's another example of data that by be useable for a formula...of course, it's easier said than done.

http://www.w3.org/TR/css3-color/#hsl-color

Any ideas?

• ###### 4. Re: breaking up the HSL spectrum into basic colors

The only way to do this, would be to mathematically divide the 360 hue values into equal portions. Not to assign arbitary 'color ranges' that you think are  perceptually distinct in some way. You also don't seem to understand what Saturation really is, and that a completely desaturated gray has no perceptually definable 'hue'. In the same way very high or low L values have no visually distinct hue either.

• ###### 5. Re: breaking up the HSL spectrum into basic colors

For practical purposes there are only eight color fulcrums

Cyan

Magenta

Yellow

Red

Green

Blue

Black

White

Black and white are both in the neutral middle (generally speaking)

Purple is blue. It's what people call something when they want blue but are disappointed.

Orange is red. Unless it is a piece of fruit.

Gold is very ambiguous term. I would guess a yellow, dark and moving toward neutral middle but that is one of many interpretations.

Brown is red moving towards neutral.

Beige is brown moving towards white.

Gray is neutral, between black and white.

This is all over generalizing. Color terminology is extremely subjective. "Vibrant" – what does that mean, exactly? Whatever you want it to mean.

Pantone is still trying to categorize colors and with each new iteration they wreck things just a little more. The only way to measure color objectively is by using Lab measurements and color management, and sometimes it is not easy. Lab is huge and much of it is beyond standard printing and inexpensive computer monitors.

Maybe you could divide the 360 hues into however many equal segments you want, and name them, but you still have to contend with neutrality. Consider a bright yellow, 60 hue, full sat and 100L. Now reduce the L (or B). It starts to look like a hideous green – but it isn't. Go figure.

• ###### 6. Re: breaking up the HSL spectrum into basic colors

Color perception issues aside, how do you evaluate the HSL of an image?

Do you calculate the average, use a (random) sample of pixels or use the histogram?

• ###### 7. Re: breaking up the HSL spectrum into basic colors

Much appreciated, guys.

@Printer_Rick:  The way I ended up doing it (with huge help from Paul MR) was by using Name that Color's script and and manually assigning each color within that script, a basic/general color (i.e. Blue, Green, Cyan, etc.).  There were a lot that fell into a "Neutral" catagory, which worked out great.

@c.pfaffenbichler:  The textures I'm using it on are pretty monotone, so I'm using Filter/Blur/Average and using pixel coordinate 100, 100 to pull the HSL from...it's also pulling the RGB and Hex values.  What it's doing is looking at the hex value and looking for the closest match in that ~1500 color list, assigns that specific color, and then a general color to go along with it.

• ###### 8. Re: breaking up the HSL spectrum into basic colors

Filter > Blur > Average creates an average value of a selected group of pixels C.. This is what I used to use before they updated the Eyedropper to have larger radius values.