Skip to content
Jolon Faichney edited this page Feb 16, 2017 · 5 revisions

Colour Modes

p5.js supports two colour modes: RGB and HSB

RGB: Red, Green, Blue

HSB: Hue, Saturation, Brightness

By default the colour mode is RGB, however it can be changed using the colorMode() function to HSB, e.g.:

colorMode(HSB);

By default colour values range from 0-255 (which is standard on computers), however you can also change this range, for example from 0-99, you read more about it in the colorMode reference.

Fill Colour

Our shapes so far have been filled with white. We can change this using the fill() function. The fill() function takes a greyscale or RGB colour as parameters. A white and pink ellipse:

background(220);
fill(255, 255, 255);
ellipse(56, 46, 55, 55);
fill(255, 100, 100);
ellipse(80, 80, 55, 55);

Clone this wiki locally