Color Theory


#1

Extremely general question I know - haha.

But how many colors are supported by by .js?

Here’s a link to my intro https://www.codecademy.com/paths/code-foundations/tracks/cf-introduction/modules/introduction-to-code-foundations/lessons/welcome-to-codecademy/exercises/multiple-colors

red = [80, 100, 65];
orange = [40, 77, 60];
green = [75, 456, 40];
blue = [196, 87, 250];
purple = [67, 50, 60];

Here’s the array where the colors are being defined - what are each of those numbers being representing? Red Yellow Blue mixture ? What is the maximum that each can go up to?

Thanks all in advance.

-V


#2

JS does not support colors. CSS handles that.

Most browsers support 24-bit color…

11111111 11111111 11111111
   red     green    blue

Pure red is, rgb(255, 0, 0).
Pure green is, rgb(0, 255, 0).
Pure blue is, rgb(0, 0, 255).

As shown, they are RGB, but we have to dig into the code and see how those arrays get interpreted. They may be HSL, though one might doubt that given that none of the values is greater than 255.

The range of each color palette is 0…255, inclusive.

There are 3 other colors that we can derive from RGB, namely, Yellow, Cyan, and Magenta.

Red + Green   =>  Yellow
Green + Blue  =>  Cyan
Blue + Red    =>  Magenta

In printing this is called YCMB where the B is black (i.e., no color). But we won’t need to study these colors for now.


#3

As it turns out these are HSL…

from bubbles.js
function makeColor(hslList, fade) {
  var hue = hslList[0]; /*- 17.0 * fade / 1000.0*/
  var sat = hslList[1]; /*+ 81.0 * fade / 1000.0*/
  var lgt = hslList[2]; /*+ 58.0 * fade / 1000.0*/
  return 'hsl(' + hue + ',' + sat + '%,' + lgt + '%)';
}

HSL stands for, Hue, Saturation, and Luminosity (or lightness).

There are 360 hues, saturation up to 100 per-cent, and lightness up to 100 per-cent.