Need a big motivation before starting .

1. Color Models
(Color Space, Color System)
Presentation with
DR . NAHLA El HAGAR
Prepared by
Mohamed Sweelam .

2. References
• R.C. Gonzales and R.E. Woods, Digital Image
Processing, Addison-Wesley, Reading, 1992.
• I. Newton, Opticks, 4th Edition, Dover, New
York, 1704/1952.
• Gur, E., Zalevsky, Z., 2007, Single-Image Digital
Super-Resolution A Revised Gerchberg
Papoulis Algorithm, international Journal of
Computer Science.
• WWW of course ^_^ .

3. Over view
 Color image processing is a very important
field with a long history :• – What are color models?
• – What are color spaces and how are they
used?
• – What new techniques are possible by
working with color pixels directly?
• What’s hue, saturation, and brightness?

4. The Meaning
• The color model also called ( Color system or
space color ) is a specification of a coordinate
system and subspace within the system where
each color is represented by single point .
S = T( f(r) ) .

5. History of Colors

6. Colors Type
• RGB : is the most use now days and called 24bits color Image .
• Gray Scale : this type has a range [0-255] and
called 8-bits color Image.
• Binary : knows as ( White and Black ) and has
a range [ 0 , 1 ] and called 1-bits Image.

7. Light And The Electromagnetic
Spectrum
•Light is just a particular part of the
electromagnetic spectrum that can be sensed by
the human eye
•The electromagnetic spectrum is split up
according to the wavelengths of different forms
of energy.

8. Human with Colors
•The lens focuses light from objects onto the retina
The retina is covered with
light receptors called
cones (6-7 million) and
rods (75-150 million)
•Cones are concentrated
around the fovea and are
very sensitive to colour
•Human eyes have three types of cone receptors
that detect light in Red , Green and Blue .

16. RGB representation
• We can imagine the RGB as a 3-dimensions .
• RGB is our Goal from
Now to the end.
• Actually RGB is three
layers behind each
other but just for
imagining .

17. Hue, Saturation and Brightness
• Hue, saturation, and brightness are aspects of
color in the red, green, and blue ( RGB )
scheme. These terms are most often used in
reference to the color of each pixel in a
cathode ray tube ( CRT ) display. All possible
colors can be specified according to hue,
saturation, and brightness (also
called brilliance ), just as colors can be
represented in terms of the R, G, and B
components.

18. Hue
• Most sources of visible light contain energy over a
band of wavelengths. Hue is the wavelength within the
visible-light spectrum at which the energy output from
a source is greatest. This is shown as the peak of the
curves in the accompanying graph of intensity versus
wavelength. In this example, all three colors have the
same hue, with a wavelength slightly longer than 500
nanometers, in the yellow-green portion of the
spectrum.
• • Hue is the actual color. It is measured in angular
degrees counter-clockwise around the cone starting
and ending at red = 0 or 360 (so yellow = 60, green =
120, etc.).

20. Hue … Cont.
• You also perceive color changing along two
other dimensions. One of the dimensions is
lightness-darkness. How light or dark a color is
is referred to either as a colors lightness
or value. In terms of a spectral definition of
color, value describes the overall intensity or
strength of the light. If hue can be thought of
as a dimension going around a wheel, then
value is a linear axis like an axis running
through the middle of the wheel

22. Saturation
• The last dimension of color that describes our response to color
is saturation. Saturation refers to the dominance of hue in the color.
On the outer edge of the hue wheel are the 'pure' hues. As you
move into the center of the wheel, the hue we are using to describe
the color dominates less and less. When you reach the center of the
wheel, no hue dominates. These colors directly on the central axis
are considered desaturated. These desaturated colors constitute
the grayscale; running from white to black with all of the
intermediate grays in between. Saturation, therefore, is the
dimension running from the outer edge of the hue wheel (fully
saturated) to the center (fully desaturated), perpendicular to the
value axis (Figure 9). In terms of a spectral definition of
color, saturation is the ratio of the dominant wavelength to other
wavelengths in the color. White light is white because it contains an
even balance of all wavelengths.

23. Saturation Cont.
• Saturation is the purity of the
color, measured in percent from
the center of the cone (0) to the
surface (100). At 0%
saturation, hue is meaningless.
• That is mean if you reach to
the pure color there is no
Conflict of the saturate of this
Color .
Like Green , Blue and Red .

24. Brightness
• • Brightness is measured in percent from black (0) to white
(100). At 0% brightness, both hue and saturation are
meaningless.
• Brightness is a relative expression of the intensity of the
energy output of a visible light source. It can be expressed
as a total energy value (different for each of the curves in
the diagram), or as the amplitude at the wavelength where
the intensity is greatest (identical for all three curves). In
the RGB color model, the amplitudes of red, green, and
blue for a particular color can each range from 0 to 100
percent of full brilliance. These levels are represented by
the range of decimal numbers from 0 to 255, or
hexadecimal numbers from 00 to FF.

26. Summary
HSB
Start with the foreground color HSB panel (lower
.
left), with the default setting: saturation and
brightness 0%, hue 0° (black).
Move the Saturation slider from 0% to 100% and
back down to 0%. Nothing happens, since
brightness is still 0%.
Do the same with the Hue control: move it around
the circle and again nothing happens without
brightness. Return it to the 0° position or simply
type 0 in the Hue text box.
Now raise Brightness gradually from 0% to 100%.
Hue is still irrelevant, since there is no saturation;
you are watching a grey scale as the color (center
panel) goes from black to white. Notice that the
RGB sliders (top panel) are moving together, since
grey or white is produced by equal amounts of
red, green, and blue light. Leave brightness at full
value.