1.3.1 Colour in Processing: RGB and HSB

In working with Processing, we have already met, in
[Creative computing I, vol. 2, chapter 1], two different colour
spaces: the RGB colour space, where each colour is represented in
terms of additive composition of three primary colours; and the HSB
space, where a colour is identified by values identifying its hue,
saturation and brightness. We have also already met the
colorMode() operator in Processing, which alters how colours are
specified in Processing code10. 10Note that the description of
colorMode() is in the
Processing documentation; the
colorMode() operator does not
change the interpretation of the
colour objects themselves (the
signed 32bit
integer) but rather the
conversion of a colour specification
into such an object of type color.
The RGB and HSB colour spaces are devicedependent
colour spaces:
they do not unambiguously specify a particular colour, as the colour
resulting from a particular specification will depend on what
equipment is used to display it; other devicedependent
colour
spaces, not available directly in Processing, include subtractive
models such as CMY (CyanMagentaYellow)
and HSB variants such
as HSL (HueSaturationLightness).
We will introduce
deviceindependent
colour spaces in section 1.3.4; these spaces
provide the means to specify a particular colour sensation,
independently of the device used to display the colour, and so allow
the exact reproduction of particular perceptual stimuli. The rest of
this section describes in detail the devicedependent
colour spaces
and the relationships between them.
r
g
b
h
Figure 1.3: Diagrammatic representation of hue in relation to red,
green and blue (r, g, b) components of a colour; the hue angle h is
the angle from the red axis around a colour circle, and is computed
using equation 1.1.
Let r, g, b be the coordinates of a colour in RGB space (with the
maximum value normalized to 1 for each); let max be the maximum
value of the three coordinates and min the minimum. Then
h = 

0 max = min;
π
3 × g−b
max−min mod2π max = r;
2π
3
+ π
3 × b−r
max−min max = g;
4π
3
+ π
3 × r−g
max−min max = b;
(1.1)
gives the hue angle from the red, green and blue components (see
figure 1.3; the mod2π is there to place the angle in the range
between 0 and 2π.
The saturation of a colour in HSB space is essentially how intense
12
Colour Spaces and Profiles
the colour itself is, and is computed by
s = � 0 max = 0;
1 − min
max otherwise
(1.2)
while the brightness is a measure of the overall intensity of the light,
and in HSB space is simply given by
β = max. (1.3)
To convert back from a hue, saturation, brightness specification to
red, green and blue values is the above process in reverse. If h, s
and β are the hue, saturation and brightness values, then let i be
�3h
π � (indicating which sixth of the hue circle the hue is in) and f,
the fractional part of the hue sextant, be 3h
π − i. Then to compute
the (r, g, b) values, compute
p = β × (1 − s)
q = β × (1 − f × s)
t = β × (1 − (1 − f) × s)
(1.4)
and then assign to (r, g, b) as follows
(r, g, b) =


(β, t, p) i = 0;
(q, β, p) i = 1;
(p, β, t) i = 2;
(p, q, β) i = 3;
(t, p, β) i = 4;
(β, p, q) i = 5;
(1.5)
Learning activity
Implement a pair of Processing classes, RGBColor and HSBColor, with fields for
red, green, blue and hue, saturation, brightness respectively.
Now implement a pair of functions, RGB to HSB and HSB to RGB, which take as
argument an instance of the appropriate class and converts it to the representation of
the same colour in the other colour space. You will need to define appropriate ranges
for each of the member variables.