Color Glossary A-C

The following glossary lists and explains color and visual perception terms which are relevant for graphic
and Web design as well as usability. The information was taken from several sources and adapted to the
needs of this glossary.

> Accomodation

ISO Definition: Adjustment of the focus of the eye, normally spontaneous, for the purpose of attaining
maximum visual acuity at various distances. (Source: ISO 8995 (1989-10-00) ISO/TC 159)

> Achromatic Colors

The "hueless" colors black, gray, and white, that is, the whole range of gray levels between black and
white.

ISO Definition: Perceived colors devoid of hue. The color names white, gray and black are commonly
used or, for transmitting objects, colorless and neutral. (Source: ISO 9241-8 (1997-10-00) ISO/TC 159)

Figure: Achromatic "colors".

> Adaptation (visual)

ISO Definition: Process by which the state of the visual system is modified by previous and present
exposure to stimuli that may have various luminances, spectral distributions and angular subtenses.

> Adaption

ISO Definition: The process which takes the luminance and/or the colour of the visual field or the final
state of this process. (Source: ISO 8995 (1989-10-00) ISO/TC 159)

> Additive Color

Synonym for the RGB (red, green, blue) color space that uses the projected red, green and blue light as
primary colors to produce the full spectrum of colors. See also Color Mixture -> Additive Color Mixture.

Figure: The primaries of additive color mixing are red, green, and blue.

> Additive Color Mixture

See Color Mixture -> Additive Color Mixture.

> Afterimages

Afterimages result from localized adaptation of the photoreceptors in those parts of the retina exposed
to the stimulus.
> Monochrome Afterimages

If a black object on a white background (or vice versa) is being focused on for several seconds, and then
a white area is being focused on, a negative afterimage is perceived. The afterimage may last for one to
two minutes.

Figure: Monochrome afterimage - glare at the dots for several seconds and you will begin to see a negative
afterimage, i.e. white dots

> Color Afterimages

If a colored area is being focusd on for a longer time (at least for about half a minute), and then a white
area is being focues on, an afterimage of the complementary color is perceived. The afterimage may last
for one to two minutes.

Figure: Color afterimage - gaze at the center of the image for about 30 seconds and then look away to a neutral area -
an afterimage of the Union Jack will be seen.

-> Large areas of bright color should be avoided on screens because of the disturbing afterimages that
can result.

> Aliasing

Makes individual pixels visible, especially along diagonal lines and curves. Also known as staircasing or
Jaggies because of the steps that appear. Lines and text look more jagged than smooth.

Figure: Aliased (normal) lines (left) vs. anti-aliased (smoothed) lines (right)
Figure: Enlarged sections of the image above

> Anti-Aliasing

A process that filters or softens the hard stair-stepped edge (and thus removes the Jaggies) in
bitmapped images by creating a series of gradually blending pixels.

Figure: Aliased (normal) text (left) vs. anti-aliased (smoothed) text (right)

Figure: Enlargement of the image above

Note: Anti-aliasing increases the number of colors in a digital image. Therefore, Web designers
sometimes prefer aliased text in order to keep the file size small.

> Brightness

Brightness is the perceived intensity of light coming from the image itself, rather than any property of
the portrayed scene. Brightness is sometimes defined as perceived luminance. (From Adelson, MIT)

> Brightness Assimilation

Reverse effect of brightness contrast, seems to depend on cognitive factors like knowledge about the
appearance of objects.

Figure: The gray under the white stripes appears lighter than the same gray under the black stripes due to brightness
assimilation
> Chromatic Colors

The "colorful" colors like, red, green, blue, yellow, purple, etc.

Figure: The chromatic primaries of additive color mixing are red, green and blue.

> Chromostereoopsis

Red and blue colors are perceived at different depths. This effect is due to the
chromatic aberration of the eye (light of different wavelengths is refracted
differently).

Blue on Red Red on Blue

Figure: Foreground and background color combinations to avoid!

Because chromostereoopsis can be quite disturbing visually, avoid displaying both vivid red and blue
together.

> CIE

Commission Internationale de l'Eclairage - this commission determines standards for color and lighting.
It developed the Norm Color system and the Lab Color Space (also called Lab Color System, or CIELAB
Color System).

> CMYK

Figure: The primaries of the CMYK color space are cyan, magenta, yellow, and black

> Color Assimilation

Color assimilation (also known as the Von Bezold spreading effect or Bezold-Brcke effect) is the
opposite of Color Contrast: Colors take on the hue of the surrounding color, whereas color contrasts
moves it into the direction of the Complementary Color.

Example: The white squares on the red background in the figure below look reddish, and those on the
blue background look bluish. Thus, the white squares tend to take on their background's colors.
Figure: The white central square shifts its hue into the direction of the surrounding color.

While the physiological mechanisms for brightness and color contrast phenomena are well understood,
the conditions how and when the assimilation occurs are not. However, as with the brightness
assimilation, the spatial frequency (coarseness) of the image seems to be an important factor.

Figure: Animated demonstration of color assimilation; look how the same color looks differently depending on the
surrounding colored triangles.

Figure: Image comparable to the image for brightness assimilation - the yellow under the red stripes appears warmer
than the same yellow under the blue stripes due to color assimilation

The contrast and assimilation phenomena are also found for brightness and darkness (Brightness
Contrast and Brightness Assimilation).
> Color Circle

Newton's color circle is a convenient way to summarize the additive mixing properties of colors (see
second figure below). R, G, B are thought of as the additive primary colors, and their complementary
colors are placed across from them on the circle. The colors then fall on the circle in the order of the
wavelengths of the corresponding spectral colors. Magenta (purple) is not a spectral color.

Figure: A color circle (from Apple Macintosh)

Figure: Using the color circle to predict the outcomes of additive color mixing (adapted from Hyperphysics)

Saturation (purity of the color) can also be described by the color circle: colors become less pure or
desaturated as you move into the center of the circle; colors become purer or saturated as you move
towards the perimeter.

Quantifying the circumference of the circle in terms of hue and its radius in terms of saturation leads
toward one of the formal color systems, the Munsell System.

> Color Constancy

The human ability to maintain the percept of a particular hue throughout variations in the quality of the
luminance or reflectance properties of the surface pigment.
> Color Deficiencies

Some individuals show drastic deficiencies in their ability to discriminate colored stimuli - these people
are called colorblind, although this term is too strong for most of the deficiencies. According to the
trichromatic color theory there are five types of color deficiencies to be distinguished:

Monochromats
Monochromats I: people with no functioning cones; people with this deficiency have
problems with daylight, because it is too bright for them; they also lack visual acuity
Monochromats II: people with only one variety of the cones functioning in addition to
the rods; both types of monochromats see colors only as variations in intensity, that, is analog to
black-and-white or unicolored images
Dichromats: People with only one malfunctioning cone system
Protanopia: malfunctioning in the red cone system; typically only two (yellow, blue) or
three colors (yellow, blue, purple) can be distinguished - yellow comprises red, orange, yellow,
and green, blue coincides with blue and purple
Deuteranopia: malfunctioning in the green cone system; green cannot be distinguished
from certain combinations of red and blue; this is the most common type of color deficiency
Tritanopia: malfunctioning of the blue cone system; longer wavelengths appear as red
and the shorter ones as bluish-green; this color deficiency is very rare

Mild instances of color deficiencies are called "anomalous trichromatism" and are fairly common;
typically these people do not act exactly like a dichromat, but need more red (protoanomaly) or green
(deuteranomaly) than a color-normal individual to match colors. More than 8% of the male and about
0.04% of the female population have some sort of color anomaly or deficiency. (Adapted from Sensation
and Perception)

Figure: Ishihara color blindness test charts

See also www.visibone.com/colorblind. Test your color vision at Michael Bennett's Website
(http://home.sc.rr.com/mikebennett/colorblind.html). Visicheck offers a color deficiency simulator
(http://www.vischeck.com/)

> Color Mixture

Additive Color Mixture

Additive color mixing describes how different wavelengths of light mix to make colors in the mind. This
color mixing is explained through the combinations of the "primary" colors red, green, and blue (RGB).
Color mixtures are usually demonstrated by shining overlapping beams of light through different color
filters onto a white (colorless) surface (as in the diagram below), or by patches of pure colored paper or
paint on a rapidly spinning disk (a "color top" or "Maxwell disk," so named because James Clerk Maxwell
used it to study color mixing in around 1855, although it was first used for that purpose by Ignaz
Shiffermller in the 1760's).
Figure: Additive color mixing using light sources

Any color can be produced by adding the colors of the three color channels RGB (Red, Green, and Blue).
If the colors of two of the color channels are mixed in equal proportions, new base colors are created.
Blue and green add up to a bright, light blue called cyan. Magenta, a bright pink, is made by mixing red
and blue. Red and green together make yellow. If red, green, and blue light are mixed equally together
at full power, you get white light.

Figure: Mixing two colors additively leads to a lighter color; if red, green, and blue light are mixed equally together at
full power, you get white light

> Monitors

Monitors and televisions produce color by using electromagnetic waves that correspond to red, green
and blue. However, screens aren't able to display the full range of colors which are visible to the human
eye. Their range of color is limited.

See also the Hyperphysics Website.

ISO Definition: Stimulation that combines on retina the actions of various color stimuli in such a
manner that they cannot be perceived individually.

> Subtractive Color Mixture

The opposite of additive color mixing, subtractive color mixing describes how the light absorbing
properties of paints mix to make colors in reflected light. This color mixing is explained through
combinations of the three subtractive "primary" colors cyan, yellow and magenta (CYM), and is usually
demonstrated by placing multiple color filters over a single beam of light, or by physically mixing paints
(i.e. inks or pigments that reflect light of a certain color). That is, the subtractive primary colors result
when a section of the visible spectrum corresponding to a single additive primary color is absorbed from
reflected white light.
Figure: Mixing colors subtractively leads to a darker color

> How Colors Are Printed

Printed colors differ from monitor colors in that they are produced by overlaying
ink pigments on paper instead of by combining different wavelengths of light. If
you tried to print red, green, and blue on top of one another, however, you could
not produce many colors. You would not be able to make yellow, for instance.
That is why printing uses subtractive instead of additive color mixing.

Figure: Printing with RGB Figure: Printing with CMYK

> Why the K?

Theoretically, if we were to print a surface with equal parts of cyan, magenta and yellow, we would see
black, because all colors would be absorbed and none reflected. In practice, however, this black looks
more like a muddy green or brown. That is why four colors are generally used in printing ("four-color
print"). Black (K) is used as the fourth color in order to achieve a real black. (From www.linocolor.com)

> Color Space

System that describes colors for objective color production, as the Norm Color and CIELAB systems; also
called color model.
The Color Space

To integrate brightness into the picture, the color triangle must be transformed from a two-dimensional
triangle into a spatial body known as color space. The color space is a three-dimensional system with
coordinates for red, green and blue:
Figure: The color space extends the color triangle into three dimensions

The further the color loci of the primary colors from the origin, the greater the volume of the cuboid
color gamut which is formed and thus the higher the quality of any color reproduction system which is
based on it.

All colors lying inside the color gamut can be reproduced by a reproduction system based on the primary
colors (for example a color monitor). Colors outside the color space cannot be reproduced.

In other words: the primary colors of a color space are determined by the equipment which generates
them.

> RGB

Color space based on the three primary colors red , blue (B) and green (G) used for additive color
mixing. Televisions and computer monitors use RGB to reproduce color.

Figure: The three primaries of the RGB color space are red, green and blue

> CMYK

Color space based on the three primary colors cyan , yellow (Y) and magenta (M) used for subtractive
color mixing, plus the achromatic color black (K). The four process colors used in four-color printing.

Figure: The four primaries of the CMYK color space are cyan, magenta, yellow and black

> HSL, HSV, HSB

Hue, Saturation, Luminance (also known as Hue, Saturation, Value or Hue, Saturation, Brightness): A
system for describing the physical perception of color, in terms of tint (hue, color tone), perceived
narrowness of the spectrum (saturation, chroma), and luminance (brightness, value).

Hue determines the position on the color wheel or color circle, Saturation is the purity of the color, and
Luminance the range of lightness to darkness of the color.

Application of the Model

In the HSL color space it is easy to change hue, saturation and luminance alone without changing the
other two characteristics; this is hard to achieve in the RGB color space that is offered by most graphic
programs.
Hue can be changed by moving the position on the color circle:

Figure: Hue changes by moving the position on the color circle

> Saturation: If, for example, blue is gradually added to a yellow, mixed from red and green, the
yellow goes through steps of decreasing purity, each "less chromatic."

#FFFF00 #FFFF40 #FFFF7F #FFFFBF #FFFFFF

Figure: Demonstration of adding blue in steps of 25% to yellow, represented as a mixture of 100% red and 100% blue

Colors of different saturation retain their original hue since the relationship between the color values of
red and green are not changed. In the color triangle, they move along the straight connecting line from
the yellow color locus towards blue, whereas in the color circle increasing saturation corresponds to a
radial outward movement:

Figure: Saturation increases by moving outwards on the color circle

> Brightness

If all three color components are reduced simultaneously while retaining their mixing ratio the hue
remains unchanged. The color decreases in brightness. If the components of all three primary colors are
reduced to zero, the resulting color will be black. Like white, black 11ur a saturation level of zero.

#0000FF #0000BF #000080 #000040 #000000

Figure: Demonstration of decreasing the brightness of 11ur blue in steps of 25%

Figure: All three dimension in the color circle

> Norm Color System

In 1931 the CIE ( Commission Internationale de l'Eclairage) developed the XYZ color system, also called
the "norm color system." This system is often represented as a two-dimensional graphic which more or
less corresponds to the shape of a sail.

Figure: The XYZ color space defined by the norm color system

The red components of a color are tallied along the x (horizontal) axis of the coordinate plane and the
green components along the y (vertical) axis. In this way every color can be assigned a particular point
on the coordinate plane. Colors on the left tend toward gray, which means that their spectral purity is
decreased.

What is not taken into consideration in this graph is brightness (the z axis). If it were, the figure would
look like a flat sack.

Color spaces can be drawn for different devices (eyes, printer, screen) for comparisons.

Figure: Relative gamuts of additive (monitor display) and subtractive (printed) color; the larger area on the graph
represents all visible colors. Click on the graph to see a more detailed version of the chart. (from projectcool Website)

> CIELAB, Lab, L*a*b

Color space defined by the CIE, based on one channel for Luminance (lightness) (L) and two color
channels (a and b).

One problem with the XYZ color system, is that colorimetric distances between the individual colors do
not correspond to perceived color differences. For example, in the figure above, a difference between
green and greenish-yellow is relatively large, whereas the distance distinguishing blue and red is quite
small. The CIE solved this problem in 1976 with the development of the three-dimensional Lab color
space.
In this model, the color differences which you perceive correspond to distances when measured
colorimetrically. The a axis extends from green (-a) to red (+a) and the b axis from blue (-b) to yellow
(+b). The brightness (L) increases from the bottom to the top of the three-dimensional model.

Figure: The CIELAB color space

This color space is better suited to many digital image manipulations than the RGB space, which is
typically used in image editing programs. For example, the Lab space is useful for sharpening images
and the removing artifacts in JPEG images or in images from digital cameras and scanners.

> Color Triangle

Any three non-collinear points plotted on a chromaticity diagram determine a color triangle. Since the
points are non-collinear, they correspond to basic, or primary hues. All of those colors on the
chromaticity diagram which fall within the triangle determined by the three points may be produced by
addition of the three hues.

Colors in the chromaticity triangle are defined by hue and saturation (chroma) only, not by brightness.
There can be any amount of brightness in the chromaticity triangle.

Figure: A basic color triangle (left); using the color triangle for demonstrating relations between colors (right)

All colors which can be produced by additive mixing of the three primary colors red, green and blue lie in
the area enclosed by this color triangle. The further a color lies from the center of the triangle the higher
its saturation (chroma). A mixed color has a high saturation level if it has only a small amount of its
third component. A maximum saturation is found in colors mixed from only two primary colors.

If the amount of the third primary color is increased until all three primaries are present in equal
components, white is the result - the saturation level is equal to zero, and the achromatic point lies in
the middle of the color triangle (see color triangle above).
 #FFFF00 #FFFF40 #FFFF7F #FFFFBF #FFFFFF

Figure: Adding blue in steps of 25% to yellow, represented as a mixture of 100% red and 100% blue, eventually leads
to white

> Color Wheel

A color wheel arranges colors around the edges of a circle. Primary colors are in the middle. Three
common color wheels are the artist's wheel, the subtractive wheel, and the additive wheel (see below).
A standard color wheel has 12 distinct hues, but does not have any visual information about saturation
or value. These 12 hues can be classified in:

Primary colors - the defining colors of the wheel; in the color wheels below, they appear in
the center as well as equally spaced around the circle
Secondary colors- the three colors that are equal distant from the primary colors
Tertiary colors - the colors between each primary and secondary color

The Artist's Color Wheel

This color wheel is used for mixing paints. It uses red, yellow,
and blue as primary colors. Violet, green, and orange are
secondary colors, and red-violet, blue-violet, blue-green,
yellow-green, yellow-orange, and red-orange are tertiary
colors.

The Subtractive Color Wheel

This color wheel uses the printing inks cyan, magenta, and
yellow as primary colors.

Note: Because cyan (C), magenta (M), and yellow (Y) inks do
not combine to make black, the printing process adds black as
a fourth ink (K).
The Additive Color Wheel

This color wheel displays the additive colors used for projected
light. When mixed together the additive primaries form white.
The primaries are red, green and blue. These colors are
extremely bright because light that is projected can be far
more intense than printed color.

Complementary Colors

Colors that add to white when mixed adaptively. Complementary colors reside at opposite ends of the
Color Circle or Color Wheel.

Examples: Magenta-green, blue-yellow, red-cyan

Figure: Complementary colors reside at opposite ends of the color circle (left) or color triangle (right)

> Complementary Colors - The Traditional Color Wheel

Complementary colors are those that are situated
across from each other on the color wheel. There is a
unity inherent in using complementary colors since any
color has as its complement the sum of the other two
primary colors. The complement of yellow, for instance
is purple, made by mixing the other two primaries, red
and blue. The complement of red is green, a
combination of yellow and blue. Compositions created
using complementary color schemes tend to feel
complete and pleasing to the eye. Complementary
colors will desaturate each other if mixed.
> Complementary Colors - The Scientific Color Wheel
In the scientific color wheel, the symmetry or unity of
the relationships of complements is even more evident.
These six colors show both the pigment primaries of
cyan, magenta and yellow along with the pigment
secondaries of red, blue-violet and green. The
complement of a primary pigment color turns out to be
a primary light color. We could just as easily call this a
color wheel for light (an additive wheel) with the
primaries being red, blue-violet and green and
secondaries of cyan, magenta and yellow.

> Contrast Sensitivity

The contrast sensitivity function for red and green is greatest for 10 point text (spatial frequency = 1
line pair/mm = 8 Hz/degree) at normal viewing distance (46 cm) and about 14 point text at arm length
(65 cm).

For blue the greatest sensitivity is around a spatial frequency of 1 Hz/degree

The sensitivity itself is about one tenth of that of red and green. This is due to
the scarcity of blue cones in the retina and to the absence of a local yellow-blue
opponent mechanism. (From Jackson et al.)

Blue Blue Red Red Green Green

Blue Blue Red Red Green Green

Figure: The primaries blue, red and green in normal face and bold face on white and black backgrounds

> Cultural Variations in the Meaning of Colors

Overview

Culture Red Blue Green Yellow White

USA, Europe Danger Manliness, Safety, safe, Caution, Purity

sweet, calm, sour Cowardice
Authority

France Nobility Freedom, Peace Criminality preliminary Neutrality

Egypt, Arab Death Virtue, Faith, Fertility, Happiness, Joy

Nations Truth Strength Welfare or
Wealth

India Life, Creativity Welfare or Success Death, Purity

Wealth, Fertility

Japan Anger, Danger Shame, Future, Youth, Grace, Dignity, Death

Despicableness Energy Nobility, childish,
 joyful

China Happiness, Joy, Sky, Clouds Ming dynasty, Birth, Wealth,

Festivity royal, Honor Strength or
Power

> The Achromatics

White

Positive: Snow, Purity, Innocence, Peace, Lightness, Cleanliness

Negative: Cold, Clinical, Vulnerability, Deathly pallor, Surrender, Sterility

Black

Positive: Night, Coal, Power, Stability, Formality, Solidity

Negative: Fear, Void, Death, Secrecy, Anonymity, Evil

Gray

Positive: Intelligence, Maturity, Wealth, Dignity, Dedication, Restraint

Negative: Confusion, Decay, Concrete, Shadow, Depression, Boredom

> The Chromatic Primaries

Red

Positive: Victory, Passion, Love, Strength, Energy, Sexuality

Negative: Blood, War, Fire, Danger, Anger, Satan

Yellow

Positive: Sun, Summer, Serenity, Gold, Harvest, Innovation

Negative: Cowardice, Treason, Jealousy, Hazard, Illness, Folly

Green

Positive: Vegetation, Nature, Spring, Fertility, Hope, Safety

Negative: Decay, Inexperience, Envy, Greed, Escapism, Bad luck

Blue

Positive: Sky, Sea, Spirituality, Stability, Peace, Unity

Negative: Cold, Depression, Melancholy, Obscenity, Mystery, Conservatism

> Color Preferences

Eysenck's "universal" order of colors for Western adults:

(1) Blue, (2) Red, (3) Green, (4) Purple, (5) Yellow, (6) Orange

The following glossary lists and explains color and visual perception terms which are relevant for graphic
and Web design as well as usability. The information was taken from several sources and adapted to the
needs of this glossary.

> Dither, Dithering

A process of placing different-colored pixels next to one another to create the illusion of additional
colors. The eye sees the two adjacent colors, and the mind blends them into a third color.

Figure: Original continuous tone photo for the demonstration of dithering (200% enlargement)

Figure: Dither pattern (left) and diffusing dithering (irregular pattern, right) for creating intermediate colors (200%
enlargement)
> Figure-Ground Phenomenon

The figure-ground phenomenon, also called figure-ground separation, refers to

the human ability to separate figures or "foreground" information from a
surrounding background or noise information. This phenomenon is often
demonstrated with ambiguous images, where you can see only one of two
possible interpretations of a scene at a time.

Old or young woman? Sax player or woman?

Faces or bird bath? Rabbit or hare?

Figure: Different figures demonstrate the figure-ground or foreground-background phenomenon

Although there can be a number of perceptual attributes listed that distinguish figures from ground, we
are still far away from fully understanding the stimulus factors and psychological processes that
distinguish figures from ground. One of these is, for example, the smaller the stimulus the more likely it
is seen as figure. Figure-ground phenomena also lead to the perception of subjective contours.

> Gamut

The gamut is the set of possible colors within a color system. No one system can reproduce all possible
colors in the spectrum. Thus, it is not possible to create every color in the spectrum with either additive
or subtractive colors. Both systems can reproduce only a subset of all visible colors. While those subsets
generally overlap, there are colors which can be reproduced with additive color and not with subtractive
color and vise-versa.

Figure: Relative gamuts of additive (monitor display) and subtractive (printed) color; the larger area on the graph
represents all visible colors. Click on the graph to see a more detailed version of the chart.

The colors that can be created by each system are called a "gamut". The ACM diagram to the left, shows
the relative gamuts of additive (monitor display) and subtractive (printed) color. The larger area on the
graph represents all visible color. Click on the graph to see a more detailed version of the chart. (From
projectcool Website)

> Gestalt Laws

The Gestalt psychologists approached lightness perception, and perception generally, in a different
manner from the Hering or the Helmholtz schools. They emphasized the importance of perceptual
organization, much of it based on mechanisms that might be characterized as mid-level. The key
concepts include grouping, belongingness, good continuation, proximity. (From Adelson, MIT)

Figure: Grouping by color (or gray level, left ) and form (right)

See also the guest editorial in Perception 11/1997 (vol. 26)"Colour in a larger perspective: the rebirth of
Gestalt psychology"

> Halftone

The process of converting a continuous-tone image into a series of one-color

dots of varying sizes. The larger and closer together the dots, the darker the
image. The finer and aparter the dots, the lighter the image.
Figure: Continuous tone image (upper left) as it is possible on computer screens and a pure black and white version of
the image created by a threshold process (upper right) in comparison to different halftone processes for printing:
patterned dither (middle left),diffusion dither (mezzotint, middle right), dots at an angle of 45 degree (screened
halftone, lower left) and the same image with a coarser dot pattern (lower right). Click the lower right image to see an
even larger version and to see the computer simulation of the dots in detail.

> Hue

Hue, along with saturation and brightness make up the three distinct attributes of color (as defined in
the HSL color space). The terms "red" and "blue" are primarily describing hue. Hue is related to
wavelength for spectral colors (see Light). It is convenient to arrange the saturated hues around a
Newton Color Circle. Starting from red and proceeding clockwise around the circle below to blue
proceeds from long to shorter wavelengths. However, not all hues can be represented by spectral colors
since there is no single wavelength of light which has the magenta hue - it may be produced by an equal
mixture of red and blue.

There are many different mixtures of wavelengths which can produce the same perceived hue. The
line from black to gray to white through the center of the circle
achromatic
represents light which has no hue.
Figure: The color wheel (left) shows spectral and non spectral hues; the color circle (right) also shows different levels
of saturation

> Hue Induction

Hue induction (chromatic induction, color induction) refers to the change of hue when colors are
perceived in the context of other colors.
Hue Induction through Simultaneous Contrast

The target color seems to be tinged with the complementary color of the surround (most noticeable with
a gray target).

Note: Hues in the red to blue range are most stable, i.e. are least affected by chromatic induction.

Figure: Hue induction makes the gray look different.

Figure: Depending of the color of the surrounding square the central neutral (gray) square gets a slight tint in the
direction of the complementary color.

> Hue Induction through Color Assimilation

When the areas of color in a pattern subtend very small angles to the observer (less than about a third
of a degree), an effect opposite to simultaneous contrast occurs: Colors appear to become more like
their neighbor instead of less like them.

Figure: The Bezold-Brcke effect (hue induction) makes the red (left) and green (right) assimilate their neighboring
colors; see also an animated example

Consequences of hue induction:

same colors appear to be different

different colors appear to be the same

> Effect of Surrounding Color

Colorfulness of a target is also affected by the surround. In general colors look most colorful against
another color in lower lightness, particularly gray.

> Image File Formats

Below we list the mostly used image file formats, their characteristics, and uses.
BMP

Native bitmap file format (BMP = bitmap) for Microsoft Windows and OS/2 (slightly different). Files can
be in 8-bit or 24-bit format and may utilize a lossless LZW compression.

Used throughout Microsoft Windows and OS/2 for bitmap files.

GIF

GIF = Graphic Interchange Format, 8-bit file format (or lesser bit depths, that is, 256 or less colors)
developed specifically for the Internet by Compuserve. Offers automatic lossless compression (LZW, but
best suited to horizontal patterns) and one transparency color.

Used for Web graphics which require only 256 or less colors, like graphics, text, screen dumps etc.

JPEG, JPG

24-bit file format with lossy compression. Offers variable degrees of compression: Higher compression
rates result in smaller file sizes but also increase compression artifacts. Basically the compression is
based on the reduction of the number of colors. When the image is compressed, colors may change
slightly.

Used for Web graphics which require more then 256 colors, like photos, graphics with smooth gradations
etc.

PICT

Native bitmap and object-oriented file format for the Apple Macintosh (comparable to WMF in Windows).

Used on the Apple Macintosh for bitmapped, vector-oriented and mixed files.
PNG

PNG = Portable Network Graphics, developed as a licence-free successor to the GIF file format. Offers 8
bit and 24 bit color depths, lossless compression and an 8-bit transparency mask for smooth transitions
between foreground and background images.

Currently not widely supported and used on the Web.

TIFF, TIF

TIFF = Tagged Image File Format, platform independent bitmap file format (there are slight differences
between Motorola-based systems (Apple Macintosh) and Intel-based systems (Microsoft Windows).
Offers different bit depths, lossless LZW compression, alpha channels and more.

Used for exchanging images between different computer platforms.

WMF

Native bitmap and object-oriented file format for Microsoft Windows (comparable to PICT on the Apple
Macintosh).

Used on Microsoft Windows for bitmapped, vector-oriented and mixed files (format of the clipboard).

> Intensity

Light waves vary in intensity and wavelength (frequency). Intensity is proportional to the square of the
amplitude of a light wave.

> Jaggies

A term for "jagged" or stair-step effect found in enlarged bitmapped images. Anti-aliasing and higher
resolution minimizes jaggies.

> Lateral Inhibition

The combined effect of the summation of adjacent excitatory and inhibitory signals causes us to perceive
an increased contrast at luminance boundaries (edges), but little or no contrast in uniform fields.

Figure: The Mach-band effect is caused by lateral inhibition

Figure: Simultaneous contrast (black and white) is also caused by lateral inhibition; it lets the same gray in the middle
of the lager squares appear differently.

> Light

Electromagnetic radiation emanating from light sources or reflected from non-radiating objects.
Perceived by our eyes and processed in the brain.

Physical dimensions: Frequency (wavelength), intensity (amplitude)

Perceptual dimensions: Brightness - related to intensity; hue (tone, tint) - related to frequency
(wavelength), lightness
Psychological dimensions: warmness/coldness, moods induced by colors, color associations,
cultural differences

The visible light spectrum lies between 380 nm (violet) and 760 NM (red).

Light travels at a constant velocity of 300.000 km/s; it takes 1,25 sec to the moon, and nearly 8
minutes to the sun.

> Lightness

Lightness is the perceived reflectance of a surface. It represents the visual system's attempt to extract
reflectance based on the luminances in the scene.

ISO Definition: Brightness of an area judged relative to the brightness of a similary illuminated area
that appears to be white or highly transmitting.

> Luminance

Luminance is the amount of visible light that comes to the eye from a surface.

Illuminance is the amount of light incident on a surface. Reflectance is the proportion of incident light
that is reflected from a surface.

Luminance, illuminance, and reflectance, are physical quantities that can be measured by physical
devices.

There are also two subjective variables:

Lightness is the perceived reflectance of a surface. It represents the visual system's attempt to
extract reflectance based on the luminances in the scene.
Brightness is the perceived intensity of light coming from the image itself, rather than any
property of the portrayed scene. Brightness is sometimes defined as perceived luminance.

> ISO Definition: The physical measurement of the stimulus which produces the sensation of
brightness, in terms of the luminous intensity in a given direction [epsilon] (usually towards the
observer) per unit area of an emitting, transmitting or reflecting surface. It is the luminous intensity of
the light emitted or reflected in a given direction from an element of the surface, divided by the area of
the element projected in the same direction. Unit: candela per square metre (cd/m2)
Note: The luminance L, in candela per square metre, of a perfectly matt surface is given by the formula
[see formula in the standard] where E is the illuminance, in lux; [rho] is the reflectance of the surface
considered. (Source: ISO 8995 (1989-10-00) ISO/TC 159)

> Moir

Moir is a repetitive box-like pattern that results when two screens overlap and are out of register. This
effect occurs when scanning screened originals due to the overlapping influence of more than one screen
- the scan screen of the scanner and the print screen of the original. Small stars or lines in the image
make it appear as if it were made of fabric.

Figure: A moir pattern

> Munsell System (Munsell Color Space)

The Munsell color system is based on the HSL color space and is used for calibrating color systems. It
matches colors to a set of standard samples (typically color charts), with adjacent samples based upon
equal perceived differences in color. It divides hue into 100 equal divisions around a color circle. This is
similar in approach to the Newton Color Circle except that the circle is distorted by assigning a unit of
radial distance to each perceptible difference in saturation (called units of chroma). Since there are more
perceptible differences for some hues, the figure will bulge outward to 18 values for some hues
compared to only 10 for another. Perpendicular to the plane formed by hue and saturation is the
brightness scale divided into a scale of "value" from 0 (black) to 10 (white). A point in the color space so
defined is specified by hue, value, and chroma in the form H V/C.

Figure: The Munsell color system (from Hyperphysics)

> Optical Illusion

Optical illusions define illusions in perception. They can be attributed to physiological (due to the
construction and functionality of the human eye) as well as psychological factors (due to
misinterpretations while seizing and comprehending the perceived objects and situations). There are
various types of optical illusions: Geometrical-optical illusions, illusions concerning motion, contrast,
perspective etc.

> Parallax
ISO Definition: Difference in the apparent relative positions of objects when viewed from different
points

> Perception

ISO Definition: Psychophysiological process occurring in the central nervous system, the product of
which is knowledge about the environment. Perception is a dynamic process and is not determined
merely by the parameters of the signals which initiated it. As a consequence, it is possible that the
information obtained may be incomplete, uncertain, or incorrect. Knowledge may be based on one or
more of the following levels of perception: detection, identification, and interpretation. Detection is the
perceptual process by which the operator becomes aware of the mere presence of a signal. Identification
is the perceptual process by which the detected signal is distinguished from other signals. Interpretation
is the combination of perceptual and cognitive processes by which the contents and significance of the
identified signal are recognised. (Source: EN 894-2 (1997-02-00) CEN/ TC 122)

> Pixel

ISO Definition: the smallest element that is capable of generating the full functionality of the display

> Primary Colors

Primary colors theoretically cannot be mixed from any other colors. The RGB primary additive colors
(red, green, blue) can be mixed in varying combinations to produce millions of additive colors. The
subtractive colors red, yellow and blue or magenta, yellow, cyan can be mixed as printer's ink or artist's
pigment to produce thousands of colors.

Primary colors are: red, green, blue (additive color mixture), red, yellow, blue (arts, subtractive color
mixture for paints) or cyan, magenta, yellow (subtractive color mixture for print).

Note: Often the colors cyan, magenta, yellow are called blue, red and yellow (like the primary colors for
arts). Note however, that the secondary colors which are created by mixing the primaries are different if
the first set or the second set is used. Be careful and consult the respective illustrations in order to not
get confused by this ambiguity.

+ +

+ +

+ +

Figure: Different triples of primary color - red, green, blue (additive color mixing), red. yellow - blue (arts, subtractive
color mixing), and cyan, magenta, yellow (subtractive color mixing, print)

> Process Colors

A term that is a synonym for CYMK (cyan, yellow, magenta, black), the four inks used by printers to
produce full-color printing. Also referred to as four-color printing.
Figure: The four primaries of the CMYK color space cyan, magenta, yellow and black

> Psychological Effects of Colors

Colors do not have only sensorial but also psychological effects and may affect people's moods:

Cool: blue, turquoise, violet

Warm: yellow, orange, red, brown
Achromatic colors (white, gray, black) may take on either a warm or a cool character with just
a hint of color.
Green and magenta are marginal, depending on which colors surround them - they will tend to
the opposite.

Warm hues act stimulating, while cool hues act relaxing. These effects are, for example, taken into
account when decorating the interior of buildings.

> Reflectance

Reflectance (of a surface) is the proportion of incident light the surface reflects.

ISO Definition: The ratio of the luminous flux reflected from a surface on it. The reflectance depends
on the direction of the incident light, except for matt surfaces, and on its spectral distribution.

> Saturation

Saturation is related to how much white content is in the stimulus - it describes the purity of colors. As
used in HSL, HSV, or HSB it refers to the presence or lack of chroma or color pigment. A color that is
100 percent saturated contains no white (monochromatic colors). A color that has 0 percent saturation is
white.

ISO Definition:
chromaticness, or colorfulness, of an area judged in proportion to
its brightness

Figure: A red changing from 0% saturation to 100% saturation in steps of 25% each

> Secondary Colors

The three colors which are created by mixing the three primary colors. Additively mixing the primary
colors red, green and blue results in the following secondary colors: cyan (blue-green), magenta (blue-
red), yellow (green-red).
Depending on the primary colors, other secondary colors are created. For instance, the primaries red,
yellow and blue, which are used in arts (pigments, thus subtractive color mixing), produce the
secondaries green (blue-yellow), orange (red-yellow), and violet (red-blue).

> Simultaneous Contrast

Simultaneous contrast is caused by lateral inhibition and can be observed for black-and-white as well as
for colored images.

Simultaneous Contrast (Black and White)

Simultaneous contrast lets the central gray square look differently, depending on the surrounding gray
level, although all the central squares are composed of the same gray.

Figure: Simultaneous contrast (black and white)

> Simultaneous Color Contrast

Simultaneous color contrast effects that

colors shift their hues into the direction of the complementary color (the opposite effect of Color
Assimilation, where colors tend to adopt similar hues)
colors look lighter or darker with respect to the background color (essentially the same effect as
with black and white)

The change in appearance of a central area is caused by the presence of a neighboring area. The effect
is strongest when the inducing field completely surrounds the target area.
Figure: Simultaneous contrast makes the central blue look different

Figure: Simultaneous contrast makes the central gray adopt different hues (and brightnesses, depending on the
brightness of the surrounding color)

Figure: Color contrasts intensifies complementary colors (left); the same central colors look less intensive with other
surrounding colors (confounded with brightness, therefore some colors still look intensive).

An Example

Color contrast and Color Assimilation or other effect of Hue Induction demonstrate that the perceived
brightness/color of an object or region of a scene does not depend simply on its own brightness/color.
There are basically two phenomena:

1. The same color may look differently

2. Different colors may lead to a similar color impression
Below are a few demonstrations of this, inspired by a book of Edward Tufte:

Figure: The same color looks differently depending on the surrounding color

Figure: Though the colors of the middle squares seem to look the same, they are different, as the next figure shows:

Figure: The colors of the central squares

Figure: This is how the same color (the left color) looks depending on the two backgrounds

> Size Constancy

Size constancy denotes the stability of perceived size despite changes in objective distance and retinal
image size.
Figure: Size constancy lets the person to the right appear much larger than the one to the left, even though both are
of the same physical size (from Shepard)

> Stereopsis

ISO Definition: Binocluar, visual perception of depth or three dimensional space.

> Subjective Colors

Colors which are perceived from moving, e.g. rotating, black-and-white images are called subjective
colors. One such device is Benham's disk. It was invented by a nineteenth-century toymaker who
noticed colors in a black-and-white pattern he had mounted on a top. Toy spinning tops with Benham's
disks are still available in toy stores. The effects are, however, rather subtle.
Figure: Benham's disk for inducing subjective colors

Figure: A variant of Benham's disk (from Sensation and Perception)

> Subjective Contours

Subjective contours demonstrate that form can emerge through the use of depth cues in a two-
dimensional array - the observer perceptually "creates" the contours defining a form. Coren (1972)
suggested that subjective contours arise when we use depth cues within a configuration to help organize
an otherwise meaningless array into a simpler, more meaningful figure. A typical such depth cue is
interposition,
that is, the occlusion of an object by another one. The occluded
object is perceived as the more distant one (see figures below). The figure
defined by the subjective contour acts remarkably like a "real" contour even to
the extent that it can mask a real contour. (Adapted from Sensation and
Perception)
Figure: Examples for subjective contours (left: a triangle is perceived; right: a circle is perceived)

> Subtractive Color

The opposite of additive color, subtractive color represents inks or pigments that reflect the light of a
certain color. Its primaries are cyan, magenta and yellow. The primary colors of magenta, cyan and
yellow can be mixed together to make up millions of colors. See CMYK and Color Mixture -> Subtractive
Color Mixture.

> Subtractive Color Mixture

Figure: The primaries of subtractive color mixture for print are cyan, magenta, yellow, and black

> Visual Impairments

Most visual impairments have physiological reasons. Some of them originate from the lens alone, some
from its physical relation to the eye ball, others from the sensors, that is from malfunctions of rods or
cones, or the neural pathways and processing.

The tables below provide an overview of the most common visual impairments. For more information on
visual impairments, see Vision and Visual Disabilities - An Introduction in the Editions section of the SAP
Design Guild.

Overview of Visual Impairments

The first table covers impairments that are related to malfunctions of sensors. The second table includes
impairments caused by defects in the optical or neural system or by diseases.

Sensor-Related Impairments
Loss of Loss of Low Night- Day- Color
Central Peripheral Acuity Blindness Blindness Deficiencies
Vision Vision

Synonyms Tunnel Glare Color blindness

vision sensitivity

Affected Cones Rods Cones Rods Cones Cones (one or

Sensors more types
affected)

Syndromes Macular Retinitis Coincides Retinitis Monochromats Dichromats:

degeneration pigmentosa with loss pigmentosa (all cone types Protanopia
(age-related (RP) of central affected) Deuteranopia
or inherited) vision Tritanopia
Usher
Inverse syndrome Monochromats
retinitis (RP
pigmentosa combined
with hearing
loss)

See also
Glaucoma

Table 1: Overview of sensor-related visual impairments

Visual Impairments Caused by the Neural or Optical System or by
Diseases
Sightnedness Lens Loss of Vision Loss of Focusing
Clouding Field Peripheral Problems,
Vision Distortions

Synonyms Cortical blindness Tunnel vision

Remarks Typically remedied Can be Can include total Can lead to Can lead to total
by glasses or remedied by loss of vision total loss of loss of vision
contact lenses lens surgery vision

Affected Lens, eye ball Lens Optic nerve Optic nerve Blood vessels
Parts (visual pathway), (close to (arteries) in
brain lens) retina

Syndromes Farsightedness Damages in the Glaucoma

neural pathways
Cataracts Diabetic
or in brain
Nearsightedness retinopathy
regions dedicated
(caused by age-
to vision
related diabetes)
Astigmatism

Table 2: Overview of further visual impairments