Computer Graphics

with OpenGL 3e

© 2005 Pearson Education

Chapter 12 Color
models and color
applications

© 2005 Pearson Education

Properties of light (1)

• The electromagnetic spectrum

– In physical term, color is electromagnetic radiation within
a narrow frequency band
– Each frequency value within the visible region of
the electromagnetic spectrum corresponds to a
distinct spectral color
– At low-frequency end are red colors and at the high-
frequency end are violet colors

© 2005 Pearson Education

Properties of light (2)

• The wave model of electromagnetic radiation

– Light is described as oscillates transverse electric and
magnetic field propagating through space
– For each spectral color
• Frequency f, the rate of oscillation of the field
magnitude
• Period T, the time between any two consecutive position on
the wave that have the same amplitude
• Wavelength λ, the distance that the wave has traveled
from the beginning of one oscillation to the beginning of
the next oscillation
– The speed of light c, can be
expressed as c = λf

© 2005 Pearson Education

Properties of light (3)

• Dominant frequency
– Light source emits all the frequencies within the visible
range to produce white light
– Some frequency are aborted when white light is incident
upon an opaque object
– The combination of frequencies present in the reflected light
determines what we perceive as the color of object
• For example, an object is described as red, when
the perceived
light has a dominant frequency at the red end of the
spectrum
– Dominate frequency is also called as hue or color of
light

© 2005 Pearson Education

Properties of light (4)

• Psychological characteristics of color

– Three basic sensation of human eyes
• Color (dominant frequency)
• Brightness, corresponds to the total light energy and can
be quantified as the luminance of the light
• Purity (saturation), how close a light appear to be a
pure spectral color, such as red
– Chromaticity, used to refer collectively to the two properties describing
color characteristics: purity and dominant frequency

© 2005 Pearson Education

Color models (1)

• Method for explaining the properties or behavior of

color within some particular context
• Primary color
– Combine the light from two or more sources with different
dominant frequencies and vary the intensity of light to
generate a range of additional colors
– Primary color, hue chosen for the sources
– Color gamut, the set of all colors that can produced from the
primary colors
– Complementary colors, two primaries that produce white
• Examples: red and cyan, green and magenta, blue and
yellow

© 2005 Pearson Education

Color models (2)

• Shades, tints and tones in scene can be produced by

mixing color pigments with white and black
pigments
– Shades, add black pigment to pure color
• The more black pigment, the darker the shade
– Tints, add white pigment to the original color
• Making it lighter as more white is added
– Tones, produced by adding both black and white
pigments

© 2005 Pearson Education

Standard primaries and the chromaticity
diagram (1)

• Standard primaries
– Three standard primaries are defined by CIE by 1931
– Imaginary color defined mathematically with positive
color- matching functions
– Eliminate the negative-value color matching and other problem
associated with selecting a set of real primaries
• The XYZ model
– CIE primitives is referred to as the XYZ model
• In XYZ color space, color C (λ) represented
as C (λ) = (X,Y,Z)
• Where XYZ are calculated from the color-
matching
X  k functions
fx (  )I (  )d
visible 

Y  k
visible 
fy (  )I (  )d
Z  k 
visible 

© 2005 Pearson Education

 fz (  )I (  )d
Standard primaries and the chromaticity
diagram (2)

• Color-matching functions

© 2005 Pearson Education

Standard primaries and the chromaticity diagram
(3)
• The XYZ model
– Normalized XYZ values
• Normalize the amounts of each primary against the sum
X+Y+Z, which represent the total light energy
x X
X Y 
ZY
y
 X Y 
ZZ
z
X Y 
• Z x+
Where y + z =1, color can be represented with just x and y
• x and y called chromaticity value, it depend only on hue
and purify

© 2005 Pearson Education

Standard primaries and the chromaticity diagram
(4)

• The CIE chromaticity diagram

– A tongue-shape curve formed by plotting the
normalized amounts x and y for colors in the visible
spectrum
• Points along the curve are spectral color (pure
color)
• Purple line, the line joining the red and violet
spectral points
• Illuminant C, plotted for a white light source and used
as a standard approximation for average daylight

© 2005 Pearson Education

Standard primaries and the chromaticity diagram
(5)

• Usage of CIE chromaticity diagram

– Comparing color gamuts for different set of primaries
– Identifying complementary colors
– Determining purity and dominate wavelength for a given color
• Color gamuts
– Identify color gamuts on diagram as straight-line segments or
polygon regions

© 2005 Pearson Education

Standard primaries and the chromaticity diagram
(6)

• Color gamuts
– Example
• All color along the straight line joining C1 and
C2 can be obtained by mixing colors C1 and C2
• Greater proportion of C1 is used, the resultant color is closer
to C1 than C2

© 2005 Pearson Education

Standard primaries and the chromaticity diagram
(7)

• Complementary colors
– Represented on the diagram as two points on opposite
sides of C and collinear with C
– The distance of the two colors C1 and C2 to C determine
the amount of each needed to produce white light

© 2005 Pearson Education

Standard primaries and the chromaticity
diagram (8)

• Dominant Wavelength
– Draw a straight from C through color point to a spectral color
on the curve, the spectral color is the dominant wavelength
– Special case: a point between C and purple line
• Purity
– For a point C1, the purity determined as the relative distance of C1 from
C along the straight line joining C to Cs

© 2005 Pearson Education

The RGB color model (1)

• Basic theory of RGB color model

– The tristimulus theory of vision
– It states that human eyes perceive color through the stimulation
of three visual pigment of the cones of the retina
• Red, green and blue
– Model can be represented by the unit cube defined on R,G
and B axes

© 2005 Pearson Education

The RGB color model (2)

• RGB color model

– An additive model, as with the XYZ color system
– Each color point within the unit cube can be represented
as a weighted vector sum of the primary colors, using
vectors R, G and B
C (λ) = (R, G, B) = RR + GG + BB
– Chromaticity coordinates for the National Television System
Committee (NTSC) standard RGB primaries

© 2005 Pearson Education

The YIQ and related color models (1)

• YIQ, NTSC color encoding for forming the

composite video signal
• YIQ parameters
– Y, same as the Y complement in the CIE XYZ color
space
• Convey luminance information
• Calculated from the RGB
equations Y = 0.299 R + 0.587
G + 0.114 B
– Chromaticity information is incorporated
with I and Q parameters
• Calculated by subtracting the luminance from the red and blue
components of color
I

=R–YQ
=B–Y
© 2005 Pearson Education
The YIQ and related color models (2)

• Transformation between RGB and YIQ color spaces

– Transformation matrix of conversion from RGB to
YIQ 0.587
YI   0.299 0.114  R G 
   
 0.587  0.114    
Q    0.701   B
  0.299 0.587 0.114  
   
– Transformation matrix of conversion from YIQ to RGB
• Obtain from the inverse matrix of the RGB to YIQ conversion
1 0
R   1  Y 
G  
 B  1  0.509  0.194    I 
 1 1 
0  Q 

© 2005 Pearson Education

The CMY and CMYK color models (1)

• Color models for hard-copy devices, such as printers

– Produce a color picture by coating a paper with color pigments
– Obtain color patterns on the paper by reflected light, which
is a subtractive process
• The CMY parameters
– A subtractive color model can be formed with the primary
colors cyan, magenta and yellow
– Unit cube representation for the CMY model

© 2005 Pearson Education

The CMY and CMYK color models (2)

• Transformation between RGB and CMY color spaces

– Transformation matrix of conversion from RGB to
CMY
M    
 C   1  G  1  R 
 Y   1   B 
– Transformation matrix of conversion from CMY to RGB
R
G  1  M 1  C 

      
 B  1  Y
  

© 2005 Pearson Education

The HSV color model (1)

• Interface for selecting colors often use a color model

based on intuitive concepts rather than a set of
primary colors
• The HSV parameters
– Color parameters are hue (H), saturation (S) and value (V)
– Derived by relating the HSV parameters to the direction in the
RGB cube
– Obtain a color hexagon by viewing the RGB cube along
the diagonal from the white vertex to the origin

© 2005 Pearson Education

The HSV color model (2)

• The HSV hexcone

– Hue is represented as an angle about the vertical axis
ranging from 0 degree at red to 360 degree
– Saturation parameter is used to designate the purity
of a color

© 2005 Pearson Education

The HSV color model (3)

• The HSV hexcone

– Color regions for selecting shades, tints and tones are
represented in the cross-sectional plane of HSV hexcone
– Adding black to a spectral color decrease V along the side of
the hexcone toward the black point
– Adding white to a spectral color produce the tints across the top
plan of hexcone
– Various tones are obtained by adding black and white to spectral
color, which generate points within the cross-sectional area

© 2005 Pearson Education

The HSV color model (4)

• Transformation between HSV and RGB color

spaces
– Procedure for mapping RGB into HSV
class rgbSpace {public: float r, g, b;};
class hlsSpace {public: float h, l, s;};
void hsvT0rgb (hlsSpace& hls,
rgbSpace& rgb)
{
/* HLS and RGB values are in the range from 0 to 1.0
*/ int k
float aa, bb, cc, f;
if ( s <= 0.0)
r = g = b = v; // Have gray scale
if s = 0. else {
if (h == 1.0)
h = 0.0;
h *= 6.0;
k = floor (h); f
= h - k;
aa = v * (1.0 -
s);
bb = v * (1.0 -
(s * f)); © 2005 Pearson Education
cc = v * (1.0 -
(s * (1.0 -
The HSV color model (5)

• Procedure for mapping RGB into HSV (continue)

switch (k)
{
case 0: r = v; g = cc; b =
aa; break; case 1: r = bb; g = v;
b = aa;
break; case 2: r = aa; g = v; b=
cc; break; case 3: r = aa; g = bb; b
= v; break; case 4: r = cc; g = aa; b
= v; break; case 5: r = v; g=
aa; b = bb; break;
}
}
}

© 2005 Pearson Education

The HSV color model (6)

• Transformation between HSV and RGB color spaces

– Procedure for mapping HSV into RGB
class rgbSpace {public: float r, g, b;};
class hlsSpace {public: float h, l, s;};

const float noHue = -1.0;

inline float min(float a, float b) {return (a < b)? a : b;}
inline float mab(float a, float b) {return (a > b)? a : b;}

void rgbTOhsv (rgbSpace rgb, hlsSpace hls)

{
float minRGB = min (r, min (g, b)), maxRGB = max (r, max (g,
b)); float deltaRGB = maxRGB - minRGB;
v = maxRGB;
if (maxRGB != 0.0)
s = deltaRGB / maxRGB;

© 2005 Pearson Education

The HSV color model (7)

• Procedure for mapping HSV into RGB (continue)

else
s = 0.0;
if (s <= 0.0)
h = noHue;
else {
if (r ==
maxRGB)
h = (g - b) / deltaRGB;
else
if (g == maxRGB)
h = 2.0 + (b - r) / deltaRGB;
else
if (b == maxRGB)
h = 4.0 + (r - g) / deltaRGB;
h *= 60.0;
if (h < 0.0)
h += 360.0;
h /= 360.0;
}
}

© 2005 Pearson Education

The HLS color model

• HLS color model

– Another model based on intuitive color parameter
– Used by the Tektroniz Corporation
– The color space has the double-cone representation
• Used hue (H), lightness (L) and saturation (S) as parameters

© 2005 Pearson Education

Color selection and applications

• Graphical package provide color capabilities in a

way that aid users in making color selections
– For example, contain sliders and color wheels for RGB
components
• Color applications guidelines
– Displaying blue pattern next to a red pattern can cause eye
fatigue
• Prevent by separating these color or by using colors from
one-half or less of the color hexagon in the HSV model
– Smaller number of colors produces a better looking display
– Tints and shades tend to blend better than pure hues
– Gray or complement of one of the foreground color is usually
best for background

© 2005 Pearson Education