A Note About Colour - ThePix/QuestJS GitHub Wiki

Quest 6 does everything in a web page, so the colours work the same way as any other web page, with HTML and CSS.

Named colours

There are 140 named colours that all modern browsers use. You can see them listed here or here. Note that there are no spaces in the names, even if they are more than one word. They are not case sensitive.

mapColour:'CornflowerBlue',

RGB

If that is not enough for you, you can use the RGB format. Computers handle colours by splitting them into three components, red, green and blue, corresponding to the receptors in the human eye. Each colour is defined as a certain amounts of red, numbers from 0 to 255, so much green, and so much blue. This gives you over 16 million different colours - though it is debatable how readily some can be distinguished.

You assign these as a kind of CSS function, but nevertheless it is still a string. This is for the colour red, as the red channel is at its maximum, the green and blue at zero:

mapColour:'rgb(255,0,0)',

Hexadecimal

An alternative to the RGB format is to use hexadecimal. Hexadecimal is convenient way to display binary number (as used by computers); it has 16 digits, rather than the usual 10, with the letters a to f used. Below, decimal numbers are on the left, hexadecimal in the middle, binary on the right.

  1  1      1
  2  2     10
  ...
  9  9   1001
 10  a   1010
 11  b   1011
 12  c   1100
 13  d   1101
 14  e   1110
 15  f   1111
 16 10  10000
 17 11  10001
  ...

The hexadecimal should be a string, starting with a #, like this, which again gives red:

mapColour:'#ff0000',

There is also an even shorter format, in which each character is assumed to be doubled. Thus, this is the same as the above.

mapColour:'#f00',

Here is the cornflower colour in hexadecimal format:

mapColour:'#6495ED',