Question

I wrote a similar post on Graphic Design.

I need to know how to calculate if a color is Warm or Cool, Active or Passive, the saturation of the color, the Chroma of it, etc in Javascript (jQuery).

For the code I think I can handle it, but I need to know the ranges (starting point to ending point) and/or additionnal hints about that.

If anyone can can help with this, he’s/she’s welcomed.

Thank you all

Answer 1

This Wikipedia article will help you calculate colour hue which can be related to colour temperature (warm/cold and everything in-between).

I suspect the same hue value can determine active/passive colour nature.

The other article talks about HSL/HSV where hue, saturation and lightness/intensity/brightness are being calculated from RBG values. Chroma is also mentioned in it.

Now what about Javascript

Doing these things in Javascript is just as much of a math question as in any other language. You have all the same math constructs (or can at least write them).

Given RBG values (in either HEX or 0..255 integer for each colour) you can then calculate these values and determine colour properties as per your problem.

And example of calculating hue in Javascript:

// individual values of RGB are provided in these three valiables
var r, g, b;
...
// if values are set between 0..255 then use these as well
r = r/255; g = g/255; b = b/255;

// hue is calculated where red 0°, green 120° and blue 240°
var h = Math.atan2(Math.sqrt(3) * (g - b), 2 * r - g - b);

Or you could also use the simplified formulas based on Preucil that selects a particular formula based on individual colour component relation…