color theory!.pdf

Color Definitions

How are colors classified? What is a saturated color? Here is an explanation of the chromatic circle

and definitions of color terms such as you have never had before!

Primary colors: Primary colors - red , yellow and blue - may not be created by mixing other colors. On the

contrary, they are mixed with one another to produce other colors. In printing and plastic arts, magenta (a pinkish

red), yellow and cyan (a blue) are used as primary colors because they are better suited to mixing, and yield

better balanced secondary colors. A mixture of the three primary colors produces black.

Secondary colors: They result from the mixing of two of the primary colors. Red (magenta) and yellow produce

orange, yellow and blue (cyan) produce green while red and blue (cyan) produce violet.

Intermediate colors: Mixing a primary and a secondary color produces an intermediate color such as orange-

yellow.

Complementary colors: Colors that are opposite one another in the chromatic circle are called complementary.

For example, green (resulting from the mixing of the primary colors yellow and blue [cyan]) is complementary to

red. Orange (a mixture of yellow and red [magenta]) is complementary to blue, while violet (a mixture of blue

[cyan] and red [magenta] is complementary to yellow.

Warm colors: Colors ranging between yellow to red-violet on the circle i.e. yellow, orange-yellow, red and red-

violet.

However, interaction between colors may cause a hue such as red-violet to appear warmer if it is placed next to a

cold color, such as green, or colder if it is placed next to a warm color, such as orange.

Cold colors: Colors ranging between blue-violet and yellow-green on the chromatic circle i.e. blue-violet, blue,

blue-green, green, yellow-green.

However, interaction between colors may cause a hue such as yellow-green to appear colder if it is placed next to

a warm color, such as red, or warmer if it is placed next to a cold color, such as blue.

Pale or clear colors: Hues containing more or less white.

Dark colors: Hues containing more or less black.

Saturated or bright colors: Pure hues containing, theoretically, no white, black, gray or complementary colors.

However, this definition can be stretched to extend the range of complementary colors. For example, the range of

saturated blues is not limited to pure blues. Blues containing white or black may still be considered saturated. On

the other hand, orange containing black, even in small quantities, is considered unsaturated because it becomes

brownish.

Unsaturated or gray-tinted colors: Hues containing more or less gray, or of their complementary color.

Theoreticians also use the expression "dull colors" to designate those colors. The expression does not carry a

derogatory meaning.

Munsell Color Space

Harmony: In decoration, harmony refers to a combination of colors that is pleasing to the eye.

The Voice of Color® has adopted definitions derived from the Munsell System of Color Notation. The Munsell

System arranges colors in a three-dimensional space resembling a tree. The trunk (vertical axis) serves as a scale

for neutral gray tones, black being at the bottom, white at the top. The horizontal axes, in variable lengths,

represent a degree of saturation for each of the hues.

The world renowned Munsell System describes each color according to three attributes: hue, value and chroma

(saturation), terms that allow all those interested in color to speak the same language.

Chromatic Circle

Hue: It is the quality that distinguishes one color from another. It is, for example, what differentiates blue from

yellow.

Munsell Value

Value: It refers to the position of a hue relative to the vertical gray scale. Value allows to qualify hues as pale or

dark, or light and dark.

Munsell Chroma

Chroma (saturation): It describes the horizontal spread between a hue of the same scale value as neutral gray.

Chroma allows us to describe a color as saturated or unsaturated, or as bright or gray-tinted. Adding gray makes

the hue less saturated or more unsaturated. A hue can also be modified with the addition of some of its

complementary color.

The seven color contrasts:

The seven color contrasts, as described by Johannes Itten (The Art of Color), form the basis of almost every color

effect used in interior design. The Voice of Color® provides a brief explanation. To find out how to transpose those

notions into decorating, visit the Playing with Space page of the About Color section.

Pure color contrasts (hue)

They result from the juxtaposition of saturated colors that are clearly different. These contrasts are peak when the

three primary colors are juxtaposed to one another.

Light-dark contrasts (value)

They are produced by the juxtaposition of a pale and dark color or of a clear and dark color. In a monochromatic

palette, the use of such contrasts adds depth to the entire palette. In a palette made up of different colors,

however, the absence of such contrasts, or the use of hues of equivalent lightness, help to link the different colors.

Warm-cold contrasts (temperature)

They result from the juxtaposition of warm and cold colors, which makes warm hues appear warmer, and vice

versa. This type of contrast, which helps balance color schemes, can be found in many of the Harmony

Collection™ palettes.

In AF-8, the yellow (warm) makes the greens look rather cold, whereas in

AF-6, the blue (cold) makes them look warmer.

Complementary contrasts

They refer to the juxtaposition of diametrically opposed colors on the chromatic circle. Such contrasts contribute

to the fundamental and natural balance of chromatic composition.

http://www.voiceofcolor.com/en/aboutcolor/decorating_library/playingwithspace/index.asp

http://www.voiceofcolor.com/en/aboutcolor/decorating_library/playingwithspace/index.asp

Quality contrasts (saturation)

They are the result of juxtaposing saturated and unsaturated colors, or bright and gray-tinted colors (to which

gray or its complementary color was added). This contrast exists only if unsaturated colors are considerably

dominant.

In this example, the red (232-7), relatively more luminous, contrasts

with the other colors which are more attenuated.

Simultaneous contrasts

They flow from the juxtaposition of two colors that are not exactly complementary. In such cases, colors seem to

repel one another and vibrate as the eye tries to bring them closer to their precise complementary colors. The use

of such contrasts makes chromatic compositions livelier and more interesting.

Quantity contrasts (proportion)

They are the result of the juxtaposition of little and much, small and large. The surface devoted to each color

influences their impact on compositions. Creating balanced compositions calls for more than devoting equal space

to each color. The brightness and saturation of each hue must also be taken into account. The lighter a hue, the

greater its impact and the lower its need for space. The more saturated or bright the color is, the more powerful is

its effect.

Itten's Color Contrasts

Johannes Itten was one of the first people to define and identify strategies for successful color combinations. Through his research he devised seven methodologies for coordinating colors utilizing the hue's contrasting properties. These contrasts add other variations with respect to the intensity of the respective hues; i.e. contrasts may be obtained due to light, moderate, or dark value.

The contrast of saturation (quality)

The contrast of light and dark (value)

The contrast of extension (quantity)

The contrast of complements

The contrast is formed by the juxtaposition of light and dark values and their relative saturation.

The contrast is formed by the juxtaposition of light and dark values. This could be a monochromatic composition.

Also known as the Contrast of Proportion. The contrast is formed by assigning proportional field sizes in relation to the visual weight of a color.

The contrast is formed by the juxtaposition of color wheel or perceptual opposites.

The contrast of hue (pure color)

The contrast of warm and cool (temperature)

Simultaneous contrast

The contrast is formed when the boundaries between colors perceptually vibrate. Some interesting illusions are accomplished with this contrast.

The contrast is formed by the juxtaposition of different hues. The greater the distance between hues on a color wheel, the greater the contrast.

The contrast is formed by the juxtaposition of hues considered 'warm' or 'cool.'

Combining Colors

Color combination is really the most important part of color theory and designing with colors, and also the hardest-- It always comes down to your personal judgement and how you look at colors. There are, however, some guidelines that can be used to make a color combination that is interesting and pleasing to the eye.

How many colors?It is hard to give an exact answer to this question, but in general one can say that the risk of using too many colors is greater than the risk of using too few.

Too many colors will make the page feel too busy and it usually makes it harder for the viewer to find the information he or she wants. It is also more tiring to the eyes.

A page with too few colors, on the other hand, risks being seen as a bit boring, but this need not always be the case.

One commonly used rule in these matters is to use three colors:

>> Primary color: This is the main color of the page. It will occupy most of the area and set the tone for the design as a whole.

>> Secondary color: This is the second color on the page, and it is usually there to "back up" the primary color. It is usually a color that is pretty close to the primary color.

>> Highlight color: This is a color that is used to emphasize certain parts of the page. It is usually a color which constrasts more with the primary and secondary colors, and as such, it should be used with moderation. It is common to use a complimentary or split-complimentary color for this (see below).

Color WheelBy now you should recognize the color wheel. If not, please read the section about Color Theory. As mentioned there, the color wheel is very useful when you want to combine colors in a way that is pleasing. Below I will demonstrate some of the most common ways to combine the colors in the color wheel.

Analog ColorsThe analog colors are those colors which lie on either side of any given color. Often these are color schemes found in nature. A site that makes use of analogous colors usually feels harmonious. The secondary color, as described above, can often be an analogous color.

Complementary ColorsThe complementary colors are the colors which are directly opposite from one another on the color wheel. Complementary colors are contrasting and stand out against each other. Often it is a good idea to use a complementary color as the hightlight color, as described above.

http://www.colorsontheweb.com/colortheory.asp

http://www.colorsontheweb.com/colortheory.asp

Other color combinations

Besides the color combinations described above, which are based on the position of the colors on the color wheel, there are also a few other ways of combining colors.

Monotone ChromaticA monotone color scheme is just one single hue and its variations in terms of tints, shades and saturation. Using saturation and tint/shade variations of a color is always good. However, in most cases I would advise against using a fully monochromatic scheme, as there is a risk of monotony. Using it with pure white or black can be efficient, though.

Monotone AchromaticA monotone achromatic color scheme is a special instace of the monotone scheme which consists of only neutral colors ranging from black to white. A scheme like this can be efficient, but it can very easily look boring. Using an acromatic scheme with just one bright color for highlight can be very effectful.

Split Complementary ColorsSplit complementary is a color and the analogous colors to its complement color. Using split complementary colors can give you a design with a high degree of contrast, yet still not as extreme as a real complementary color. It also results in greater harmony than the use of the direct complementary.

Triad ColorsTriad colors are three hues equidistant on the color wheel. When you want a design that is colorful and yet balanced, a triad color scheme might be the way to go.

Color Contrast

Now that we know how different colors can be combined, we just need to introduce one more important aspect of color theory, and that is contrast.

Simply put, contrast is the difference between two colors. On a web page, the amount of contrast required varies with different parts of the page. You usually want a high contrast between text and its background color. But too high contrast between design elementsmight give an unsettled and messy impression. Black and white create the highest contrast possible.

Please visit our Color Contrast Analyzer page to see if the colors you want to use have enough contrast.

Colors can contrast in hue, value and saturation, but there are many different types of contrasts that have been defined by color theorists throughout the years. Some of them are perhaps not directly applicable to web design, but let's look at a few of the most important.

Contrast of HueContrast of hue is what relates most directly to the color wheel combinations described above. The further away from each other two colors are, the higher the contrast. This means that the complementary color combination has the highest contrast, while the analogous combination has the lowest. For text, a contrast of hue alone is usually not enough to make the text as legible as wanted. In that case, you might want to combine contrast of hue with some other form of contrast.

Contrast of ValueContrast of value is very efficient in creating large contrasts. The biggest contrast of them all-- black and white-- can be said to be a contrast of value. In general, large differences in lightness are considered to be pleasant for the eye, but low contrasts of value can also be useful for more subtle differences-- for instance, in a background.

Contrast of SaturationContrast of saturation is often best for design aspects that do not require a lot of emphasis. A set of colors with different saturations set against a grey background can be interpreted as transperancy. This is something that can be used to interesting effect.

Simultaneous ContrastThis is a contrast effect that is created by our eyes' tendency to require a complementary color. You can get this effect by combining two bright colors that are not complementary, or by using a single bright color against a grey background. This gives a feeling of instability and tension and should be used with caution.

http://www.colorsontheweb.com/colorcontrast.asp

http://www.colorsontheweb.com/colorcontrast.asp

Combination of ContrastsWhile the contrasts above can be efficiently used one at the time, is is most common to use a combination of them-- especially for text where you need a high contrast. The top picture to the left shows blue and its split complementary color, orange. This is a combination that has a high contrast of hue. This gives a rather vibrant combination that can be tiring to the eyes. By changing the value and saturation as in the next picture you will get a combination which is much more pleasing to the eye, and more readable.

Colors and TextAs mentioned above, using the right contrast is especially important for text. Using the wrong colors can decrease the readability drastically, and it will quickly tire the reader's eyes. Black text on a white background has the highest readability. Black and yellow is another combination which usually has a high readability, as do blue and white.

Green text on red and red text on green are particularly hard for many people to read. A combination of red and blue creates a vibrating effect that can also make reading very

©1998-2009 Janet Lynn FordThis work is licensed under a Creative Commons License.

Art does not reproduce the visible; rather, it makes visible.— Paul Klee

Related Resources

Be sure to visit Resources for bibliographical references and links to additional sites.

Color Basics

Color is the perceptual characteristic of light described by a color name. Specifically, color is light, and lightis composed of many colors—those we see are the colors of the visual spectrum: red, orange, yellow, green,blue, and violet. Objects absorb certain wavelengths and reflect others back to the viewer. We perceivethese wavelengths as color.

A color is described in three ways: by its name, how pure or desaturated it is, and its value or lightness.Although pink, crimson, and brick are all variations of the color red, each hue is distinct and differentiated byits chroma, saturation, intensity, and value.

Chroma, intensity, saturation and luminance/value are inter-related terms and have to do with thedescription of a color.

Chroma: How pure a hue is in relation to graySaturation: The degree of purity of a hue.Intensity: The brightness or dullness of a hue. One may lower the intensity byadding white or black.Luminance / Value: A measure of the amount of light reflected from a hue.Those hues with a high content of white have a higher luminance or value.

Shade and tint are terms that refer to a variation of a hue.

Shade: A hue produced by the addition of black.Tint: A hue produced by the addition of white.

Continue tutorial, view: The Color Systems

Color Basics, Introduction to Color Theory http://www.worqx.com/color/color_basics.htm

1 of 1 10/20/2010 11:30 AM

The CMYK color system is

the color system used for

printing.

Those colors used in

painting—an example

of the subtractive color

method.

The RGB colors are light

primaries and colors are

created with light.

Percentages of red,

green, & blue light are

used to generate color

on a computer screen.

The Visible spectrum consists of billions of colors, a monitor can

display millions, a high quality printer is only capable of producing

thousands, and older computer systems may be limited to 216

cross-platform colors.

Color deceives continuously.

— Josef Albers

Color on the Web

The Web brings a level of constraint regarding the use of color; not only is there a difference in

monitor quality and resolution, but there are only 216 'browser safe colors.' This is thought of as a

concern of the past as statistics reveal that 65% of computers browsing the Web today display

16,777,216 different colors, but handheld devices are still limited to 256 colors. Read more about

Browser Statistics at: www.w3schools.com

For more information, read "Death of the Web safe Color Palette?" at Webmonkey

Color Systems

Available color systems are dependent on the medium with which a designer is working. When painting, an

artist has a variety of paints to choose from, and mixed colors are achieved through the subtractive color

method. When a designer is utilizing the computer to generate digital media, colors are achieved with the

additive color method.

Subtractive Color. When we mix colors using paint, or through the printing process, we are using the

subtractive color method. Subtractive color mixing means that one begins with white and ends with black; as

one adds color, the result gets darker and tends to black.

Additive Color. If we are working on a computer, the colors we see on the screen are created with light

using the additive color method. Additive color mixing begins with black and ends with white; as more color

is added, the result is lighter and tends to white.

Working With Systems

Color Systems - Subtractive & Additive Color http://www.worqx.com/color/color_systems.htm

1 of 2 10/20/2010 11:30 AM

©1998-2009 Janet Lynn Ford

This work is licensed under a Creative Commons License.

Reproducing color can be problematic with regard to printed, digital media, because what we see is not what

is possible to get. Although a monitor may be able to display 'true color' (16,000,000 colors), millions of these

colors are outside of the spectrum available to printers. Since digital designs are generated using the RGB

color system, colors used in those designs must be part of the CMYK spectrum or they will not be reproduced

with proper color rendering. Working within the CMYK color system, or choosing colors from Pantone©

palettes insures proper color rendering.

Continue tutorial, view: Color Wheel

Color Systems - Subtractive & Additive Color http://www.worqx.com/color/color_systems.htm

2 of 2 10/20/2010 11:30 AM

A color wheel (also referred to as a color circle) is a visual representation ofcolors arranged according to their chromatic relationship. Begin a color wheel bypositioning primary hues equidistant from one another, then create a bridgebetween primaries using secondary and tertiary colors.

All colors are the friends of their neighbors and the lovers of their opposites.— Marc Chagall

For Further Review

The color wheel is an invention credited to Sir Isaac Newton (1706). Read more about Newton's colorcircle at: Handprint.comArtists use a traditional color wheel based on the Red/Yellow/Blue model with secondary colors oforange, green and purple. Read more at: Wikipedia

Color Wheel

These terms refer to color groups or types:

Color Wheel, Color Circle, & Color Relationships http://www.worqx.com/color/color_wheel.htm

1 of 4 10/20/2010 11:31 AM

Complementary colors make a strange pair. They are opposite, yet they require each other. They incite each

other to maximum vividness when together; and annihilate each other when mixed. — Johannes Itten

Mixing Complements

As stated by Johannes Itten, complementary colors annihilate each other when mixed to create dark

neutrals:

Complementary ColorsWe look at a color wheel to understand the relationships between colors. Analogous colors are positioned in

such a way as to mimic the process that occurs when blending hues. The colors that are positioned opposite

one another are complementary colors.

To call those hues in direct opposition to each other "complements of each other" is appropriate.

Complementary colors bring out the best in each other. When fully saturated complements are brought

together, interesting effects are noticeable. This may be a desirable illusion, or a problem if creating visuals

that are to be read.

Note that Vibrating Boundaries may occur when opposing colors are brought together.

(Notice the illusion of highlighted edges and raised text.)

Perceptual Opposites. We learn from the relationships displayed by a color wheel that every color has an

opposite. Every color has both a color wheel opposite as well as a perceptual opposite. Without a color

wheel, it is still possible to find the opposite of a color and this is due to a phenomenon of our eyes. Due to

the physiological differences between individuals, everyone's perceptions do vary—the complements shown

below are my own perceived opposites:

source >> result

Color Complements, Perceptual Opposites, Analogous, & Complementar... http://www.worqx.com/color/complements.htm

1 of 2 10/20/2010 11:31 AM



Learn more about perceptual opposites. Continue the tutorial and view: After Images

Color Complements, Perceptual Opposites, Analogous, & Complementar... http://www.worqx.com/color/complements.htm

2 of 2 10/20/2010 11:31 AM

Primary Colors: Colors at their basic essence; those colors that cannot be created

by mixing others.

Secondary Colors: Those colors achieved by a mixture of two primaries.

Tertiary Colors: Those colors achieved by a mixture of primary and secondary hues.

Complementary Colors: Those colors located opposite each other on a color wheel.

Analogous Colors: Those colors located close together on a color wheel.

The color wheel can be divided into ranges that are visually active or passive. Active colors will appear to

advance when placed against passive hues. Passive colors appear to recede when positioned against active

hues.


2 of 4 10/20/2010 11:31 AM

The Painter's color triangle consists of colors we would often use in art

class—those colors we learn about as children. The primary hues are red, blue

and yellow.

The Printers' color triangle is the set of colors used in the printing process. The

primaries are magenta, cyan, and yellow.

Nine-part harmonic triangle of Goethe begins with the printer's primaries; the

secondaries formed are the painter's primaries; and the resulting tertiaries

formed are dark neutrals.

Advancing hues are most often thought to have less visual weight than the receding hues.

Most often warm, saturated, light value hues are "active" and visually advance.

Cool, low saturated, dark value hues are "passive" and visually recede.

Tints or hues with a low saturation appear lighter than shades or highly saturated colors.

Some colors remain visually neutral or indifferent.

Color relationships may be displayed as a color wheel or a color triangle.

Continue tutorial, view: Complementary Colors


3 of 4 10/20/2010 11:31 AM



Who would believe that so small a space could contain all the images of the universe.— Leonardo da Vinci (referring to the eye.)

More about the Eye

Visit the Exploratorium to learn more about After Images Bird in a CageLearn more about Color Vision at HowStuffWorks.comRead more about the Eye at:BiologyMad.com andWebExhibits.org

After Images

Color is light and colored objects absorb and reflect different wavelengths. Light & color are seen by thehuman eye because of the two types of photoreceptor cells - rods and cones - located in the retina of theeye. Rods are sensitive to light and dark; cones are sensitive to red, green & blue light and responsible forcolor vision. These photoreceptors convey the color of light to our brain. (Learn more about rods and cones,at BiologyMad.com)

When our eyes are exposed to a hue for a prolonged period, the rods & cones become fatigued. You mightnotice this if you are reading something on colored paper, and then look away—you often see the inverse, orcomplement, of the image. This occurrence can be advantageous if you are seeking the opposite, or contrast,of a color. This may be dismaying to a viewer if presented with prolonged exposure to colored screens orreading materials.

Every color has an opposite, and although individual's perceptions do vary, the range of after images seen isconsistent.

Take the After Image Test

Stare at this image for at least 20 seconds. When finished, click on the image or the link below to proceed tothe next page.

Learn more about perceptual opposites. Continue the tutorial and view: After Images

After Images, negative images, eyes fatigue, the rods & cones http://www.worqx.com/color/after_image.htm

1 of 1 10/20/2010 11:32 AM

Monochromatic Relationship Colors that areshade or tint variations of the same hue.

Complementary Relationship Those colorsacross from each other on a color wheel.

Split-Complementary Relationship One hue plustwo others equally spaced from its complement.

Double-Complementary Relationship Twocomplementary color sets; the distance betweenselected complementary pairs will effect theoverall contrast of the final composition.

Analogous Relationship Those colors locatedadjacent to each other on a color wheel.

Triad Relationship Three hues equally positionedon a color wheel.

©1998-2009 Janet Lynn FordThis work is licensed under a Creative Commons License.

Color Combinations

Color combinations may pass unnoticed when pleasing, yet offend dramatically when compositions seem toclash. One outcome we seek in the final form or composition, is a successful use of color.

We determine whether or not we are successful by critically assessing the visual balance and harmony of thefinal composition—balance and harmony are achieved by the visual contrast that exists between colorcombinations. Planning a successful color combination begins with the investigation, and understanding, ofcolor relationships.

Using a color wheel and a template, the relationships between colors are easy to identify.

Continue tutorial, view: Color & Contrast

Color Combinations, Monochromatic, Complementary, Analogous, Triad http://www.worqx.com/color/combinations.htm

2 of 2 10/20/2010 11:32 AM

Colors, like features, follow the changes of the emotions.

— Pablo Picasso

Check Your Own Compositions

See how your images appear to someone with a color deficit. Visit: Vischeck

Note: They offer a free filter for use with PhotoShop.

Color & ContrastEvery visual presentation involves figure-ground relationships. This relationship between a subject (or

figure) and its surrounding field (ground) will evidence a level of contrast; the more an object contrasts with

its surrounds, the more visible it becomes.

When we create visuals that are intended to be read, offering the viewer enough contrast between the

background (paper or screen) and the text is important. Text presentations ideally offer at least an 80%

contrast between figure and ground. (Black text on a white background is ideal.) If there is not enough

contrast between figure and ground, a viewer will squint to view the text, causing eye fatigue.

Yellow text on a white background or blue text on a black background, are difficult to read due to the

low level of contrast between figure and ground.

An occurrence known as 'simultaneous contrast' (or chromostereopsis,) may happen when opposing colors

are placed in close proximity to each other. Text may appear to vibrate, or cast a shadow. Eye strain and

fatigue will result if a viewer focuses on a document displaying similar properties for an extended time

period.

Some color combinations, such as red text on a blue background, cause illusions when positioned

together.

Sensitivity to Colorblind Deficiencies. The Design of visual documents or signage without thought to the

overall contrast level between figure and ground can be problematic for people with sight deficiencies. My

first-hand experience with this occurred years ago when visiting a hospital with a friend who was colorblind.

The hospital had creatively marked the floor with "road maps" to various areas like the lab, lobby, etc.

Unfortunately, they used red and green lines and my friend could not distinguish between the colors. If a

visual document uses color to relate important information, insure that no information is lost, or potentially

misunderstood, when the color is not available.

When choosing complementary colors, fully saturated colors will offer the highest level of contrast.

Choosing from tints or shades within the hue family reduces the overall contrast of the composition.

Continue tutorial, view: Itten's Contrasts

Color & Contrast, simultaneous contrast, choosing colors http://www.worqx.com/color/color_contrast.htm

1 of 2 10/20/2010 11:33 AM

The contrast is formed by the juxtaposition of light and dark values and their relative

saturation.

The contrast is formed by the juxtaposition of light and dark values. This could be a

monochromatic composition.

Also known as the Contrast of Proportion. The contrast is formed by assigning

proportional field sizes in relation to the visual weight of a color.

Colour is life; for a world without colours appears to us as dead.

— Johannes Itten

Itten & other Color Mentors

Bauhaus Museum on Itten

Johannes Itten by Froebel Web

Johannes Itten at the artists.org

The Bauhaus by Chris Snider

Albers at the artists.org

Itten's Color Contrasts

Johannes Itten was one of the first people to define and identify strategies for successful color combinations.

Through his research he devised seven methodologies for coordinating colors utilizing the hue's contrasting

properties. These contrasts add other variations with respect to the intensity of the respective hues; i.e.

contrasts may be obtained due to light, moderate, or dark value.

The contrast of saturation

The contrast of light and dark

The contrast of extension

Johannes Itten's Color Contrasts http://www.worqx.com/color/itten.htm

1 of 3 10/20/2010 11:33 AM

The contrast is formed by the juxtaposition of color wheel or perceptual opposites.

The contrast is formed when the boundaries between colors perceptually vibrate.

Some interesting illusions are accomplished with this contrast.

The contrast is formed by the juxtaposition of different hues. The greater the

distance between hues on a color wheel, the greater the contrast.

The contrast is formed by the juxtaposition of hues considered 'warm' or 'cool.'

Continue tutorial, view: Proportion & Intensity

The contrast of complements

Simultaneous contrast

The contrast of hue

The contrast of warm and cool

Johannes Itten's Color Contrasts http://www.worqx.com/color/itten.htm

2 of 3 10/20/2010 11:33 AM

Dominant color

Sub-dominant colors

Accent

Dominant color

Sub-dominant colors

Accent

The relation of color and the relation of proportion are both based on the relation of position.— Piet Mondrian

Masters of color & proportion

Yaacov AgamMasterworks Fineart

Google Images: Yaacov AgamWassily KandinskyGoogle images: Wassily KandinskyHenri MatisseGoogle Images: Henri MatissePiet MondrianGoogle Images: Piet MondrianPablo PicassoGoogle images: Pablo Picasso

Architects:

Luis BarragánGoogle Images: Luis BarragánRicardo LegorretaGoogle Images: Ricardo Legorreta

Proportion & Intensity

When colors are juxtaposed, our eyes perceive a visual mix. This mix will differ depending on the proportionsof allocated areas.

The color with the largest proportional area is the dominant color (the ground).

Smaller areas are subdominant colors.

Accent colors are those with a small relative area, but offer a contrast because of a variation in hue,intensity, or saturation (the figure).

Placing small areas of light color on a dark background, or a small area of dark on a light backgroundwill create an accent.

If large areas of a light hue are used, the whole area will appear light; conversely, if large areas ofdark values are used, the whole area appears dark.

Alternating color by intensity rather than proportion will also change the perceived visual mix of color.

Color Proportion & Intensity http://www.worqx.com/color/color_proportion.htm

1 of 2 10/20/2010 11:33 AM

Dominant color

Sub-dominant colors

Accent

Dominant color

Sub-dominant colors

Accent



Continue tutorial, view: Contrast & Dominance

Color Proportion & Intensity http://www.worqx.com/color/color_proportion.htm

2 of 2 10/20/2010 11:33 AM

Low contrastLow contrast compositions usecolors within a narrow range ofluminosity or brightness levels.

Moderate contrastmoderate contrast compositionsuse colors within a moderaterange of luminosity or brightnesslevels.

High contrastHigh contrast compositionscolors range from very light(high-luminosity) to very dark(low luminosity).

Simple colours can affect the intimate feelings with all the more force because they are simple.— Henri Matisse

Contrast & DominanceWhen creating a composition—either something freeform, or a more text based layout, a determination forthe final impact of the whole presentation needs to be identified. Is your intent to craft a vibrant, attentiongrabbing ad, or a presentation with a low, or more moderate level of contrast? These decisions concern whatis known as the dominant elements of the design.

The dominant element may be classified as either "contrast dominant" or "value dominant." Designs thatevidence contrast dominance or value dominance are then sub-divided into low, moderate, and high contrast,or light, medium, and dark value categories. The choice of colors will enhance or minimize the overallimpact.

It is easiest to understand the difference between dominant elements in the following compositions from adistance, or by squinting your eyes a bit. If the proximity between the neighboring hues is less apparent whenyou squint, the overall composition a displays lower contrast level; if the overall composition appears light, ithas a light value. Conversely, if distinctions between hues are very apparent, the contrast is high, and if theoverall composition appears dark, the value level is dark. Understanding how the relationships between thecolors of a chosen palette will affect the final outcome of an overall composition is integral to mastering theuse of color.

In the examples below, the overall contrast level of a composition changes with the range of luminositybetween chosen hues.

In the examples below, the overall value of each composition changes with the incorporated hues' relativesaturation.

Examples of Contrast Dominance

Examples of Value Dominance

Contrast & Dominance http://www.worqx.com/color/contrast_dominance.htm

1 of 2 10/20/2010 11:34 AM

Light valueA composition made up of tints,

displays an overall light value.

Medium valueA medium value composition is

made up of a balance between

tints, saturated hues, and

shades.

Dark valueA dark value composition

displays mostly shades.



Continue tutorial, view: Shades & Tints

Contrast & Dominance http://www.worqx.com/color/contrast_dominance.htm

2 of 2 10/20/2010 11:34 AM

Blue is the only color which maintains its own character in all its tones. Take blue in all its nuances, from thedarkest to the lightest — it will always stay blue. — Raoul Dufy

Images Used in Examples

While enrolled in a color class at the U of MN, our professor, Marian Ortolf-Bagley, encouraged us touse abstract images so as to focus on the color within the composition rather than a subject. Our taskbegan with a contour drawing of a tree. From there we 'poured' complementary colors into the voids,and then removed any linear elements.

Contour drawing of tree

Colors poured into voids

(mouse over image)

Cropped for exercises

Color Shade and Tints http://www.worqx.com/color/shade_tint.htm

1 of 3 10/20/2010 11:34 AM

Using a color wheel divided into various shades and tints is one methodof identifying possible options for color schemes. The splitcomplementary relationship shown in this example presents manypossible combinations. By varying the saturation and experimentingwith shades and tints within the hue relationship, you can achieve quitea variety of palette options. (Click on the wheel at the left to view a larger

image.)

Moderately-highcontrast, medium value,composition using fullysaturated hues.

High contrast, mediumvalue, composition usingshades, tints & varioussaturation levels.

Moderately-low contrast,medium-light value,using tints & varioussaturation levels.

Moderate contrast,medium value, usingshades, tints & varioussaturation levels.

Moderately-low contrast,medium-dark value,using shades & varioussaturation levels.

Low contrast, mediumvalue, using shades, tints& various saturationlevels.

Moderately-highcontrast, medium value,using shades, tints &various saturation levels.

High contrast, lightvalue, using shades, tints& various saturationlevels.

Color Shade and Tints

Color Shade and Tints http://www.worqx.com/color/shade_tint.htm

2 of 3 10/20/2010 11:34 AM

Colors of a

complementary

relationship assigned

equal proportion.

Colors reassigned with

proportions allocated to

dominant and

subdominant areas.

Color intensity and

proportion modified.

Using tints and shades of

the original colors results

in a moderate level of

contrast and medium

value.

Colors applied to

composition.

Color intensity and

proportion modified - the

whole area displays a

moderately-high contrast

and medium value.

Colors applied to

composition.

Color and I are one.

— Paul Klee

Recommended reading from Amazon.com

Notan: The light-dark principle of design - Dorr Bothwell

The Art of Color - Johannes Itten

Review more books about color theory!

Color Studies

Colors of a complementary relationship.

Color Studies http://www.worqx.com/color/studies.htm

1 of 3 10/20/2010 11:35 AM

Colors of a triad

relationship assigned

equal proportion.

Colors reassigned with

proportions allocated to

dominant, subdominant,

and accent areas.

Color intensity and

saturation modified - the


moderately-high contrast

level.

Colors applied to

composition.

Color intensity and



moderately low contrast

level.

Colors applied to

composition.

Color intensity and



medium/dark value.

Colors applied to

composition.

Color intensity and



light value,

Colors applied to

composition.

Colors of a triad relationship.

Color Studies http://www.worqx.com/color/studies.htm

2 of 3 10/20/2010 11:35 AM

9

O P T I C A L E F F E C T SA room painted in a light color will seem larger than that same room paintedin a dark color. This is because light colors tend to recede while dark colorsadvance. Warm colors seem closer while cool colors seem farther away. A longnarrow room will seem more in proportion if its far wall is dark and its sidewalls are light. A room with a low ceiling painted white will seem higher thana ceiling painted dark.

Colors are often said to be warm or cool in temperature and thus all colors are classified in one of these two families that create strong and differentimpressions.

Warm colors such as red, orange, and yellow, are associated with sun and fire,and therefore create a sensation that a space is several degrees warmer thanactuality. Warm colors appear to advance toward its viewer as well as excite and cause a sense of aggression.

Cool colors such as blue, violet and green, are associated with air, sky and water,and thus, are naturally cool and soothing. Cool colors tend to recede in a spaceand can create feelings of passiveness and calmness.

Note that there can be cool shades of red and warm shades of blue that aredetermined by mixtures of hues. In addition, the quality of warmth andcoolness in a color may be altered by its neighboring hues. For example, whena warm hue is in contrast with a cool hue, the warm hue appears warmer andthe cool hue appears cooler.

The rule of Simultaneous Contrast is the effect of one hue upon another.Whenever two different hues come into direct contact, the contrast intensifiestheir differences. The greatest contrast occurs with complementary colors. Forexample, red seems brightest next to green, as green seems brightest when seenwith red. There is an effect with closely related colors, for example, a yellow-green surrounded by green appears yellowish, but surrounded by yellow, theyellow-green seems more noticeably green.

The contrast can be in value or intensity as well as in hue. A gray-blue looksbrighter when placed against a gray background; however, the same gray-blueneutralizes when placed against a bright blue background. These are just a fewexamples of the tricks colors play and why it can be difficult applying color.

6

Simultaneous Contrast

Warm Colors vs. Cool Colors

C H A P T E R C O N T E N T S

I N T R O D U C T I O N

H I S T O R Y

C O L O R A N D E M O T I O N

C O L O R P R E F E R E N C E S

C O L O R A N D L I G H T

O P T I C A L E F F E C T S

B A S I C C O L O R T H E O RY

C O L O R S C H E M E S

A P P LY I N G C O L O R I N FA C I L I T I E S

9

B A S I C C O L O R T H E O R YSuccessful color selection in interior design is a combination of experience,schooling and talent. Developing the ability to properly apply color beginswith studying the basic principles of color theory.

The properties of color are based on three dimensions; hue, value and intensity.

Hue is the name of a color, such as red, blue and yellow.

Value is the lightness or darkness of a color that indicates the quantity of lightreflected.

Intensity is the saturation or strength of a color determined by the quality oflight reflected from it. A vivid color is of high intensity; a dull or muted color,of low intensity.

Hues are defined and organized by the color wheel which is made up of the following twelve colors, each at their full intensity:

Primary Colors: Red, Yellow, BlueSecondary Colors: Orange, Green, VioletTertiary Colors: Red-orange, Orange-yellow, Yellow-green

Green-blue, Blue-violet, Violet-red

The Color Wheel

Hue and the Color Wheel

7

The Three Dimensions of Color

C O L O R

T O N E

G R AY

B L A C K W H I T E

S H A D E T I N T

9

The primary colors are red, blue, and yellow. When the three primaries are

mixed in pairs, or all together in equal or unequal amounts, all possible colors

can be produced

Secondary colors are created by combining two primary colors:

Red + Yellow = Orange

Red + Blue = Violet

Blue + Yellow = Green

Primary Colors Secondary Colors

Value is the relative lightness or darkness of a color that is determined by the

amount of black or white present in a color.

A “tint” is created when white is added to lighten a color. This also gives a

color a high value.

A “shade” is created when black is added to darken a color. This also gives a

color a low value.

8

Value

9

The value of color is graded on the gray value scale with white as the highestvalue, black as the lowest value, and several tints and shades of gray in between.If a black and white photograph were taken of a room full of colors, theirequal values could be compared with the gray value scale. Note: Black andwhite printers and black and white copiers do not give the same effect as blackand white photography.

White

High light Yellow

Yellow-Orange Light Yellow-Green

Orange Low Light Green

Red-Orange Medium Blue-Green

Red High dark Blue

Red-Violet Dark Blue-Violet

Violet Low dark

Black

Color Value Scale

Intensity, or the saturation of color, is determined by the amount of gray addedto a color. The “pure” color of red will have a strong intensity while a mutedcolor of red will have a low intensity.

9

Intensity

9

The successful use of color is dependent upon a clear understanding of colorrelationships. A single color retains a certain character, but adding other colorsto its surrounding may change its characteristics. Colors may be closely relatedor in contrast. The greatest contrast occurs with complementary colors, twocolors that appear directly opposite each other on the color wheel. Forexample, red and green are complementary colors just as violet and yellow, and blue and orange are complementary colors.

Complementary Colors (extreme contrast)

Split Complementary ColorsA split complementary system involves a color with two colors on either side ofits complement. This results in a variation that has less contrast because of theshort interval between colors on the color wheel.

Split Complementary Colors

10

Color Relationships

9

There is less contrast when three colors are spaced equally apart on the colorwheel and used together. The first group is called the primary triad whichconsists of red, yellow and blue. This triad provides the most striking contrast.

Primary Triad (vibrant contrast)

The secondary triad, composed of orange, green and violet, has the sameinterval between hues, yet gives a softer contrast.

Secondary Triad (soft contrast)

11

9

Analogous colors appear next to each other on the color wheel, and because

they have the shortest interval between them, they have the most harmonious

relationship.

Analogous Colors (Close relationships)

Our fascination with color has resulted in the development of a number of

color systems. The most widely used system for identifying color was

developed in the early 1900’s by the American artist, Albert Munsell. Munsell’s

system shows the relationships between color, tints and shades. The system was

used to give names to the many varieties of hues that result from mixing

different colors with each other or mixed with the neutral colors black and

white. In 1943, American industry adopted the Munsell system as its standard

for naming colors. The United States Bureau of Standards in Washington,

D.C. also adopted this system.

Munsell Color Wheel

12

The Munsell System

9

The Munsell system has five basic colors: red, yellow, green, blue and purple

(violet). Intermediate colors are created by the mixture of any two of the basic

colors that are adjacent on the color wheel. For example, the mixture of red

and yellow is the intermediate color red-yellow. Other intermediate hues

include green-yellow, blue-green, purple-blue, and red-purple.

Munsell devised a three-dimensional color system that classifies the variations

of colors according to the qualities of hue, value, and intensity.

Each hue is indicated by the notation found on the inner circle of the color

wheel – R for red, Y for yellow, G for green, B for blue, and P for purple. The

intermediate or tertiary colors are described with two letters such as RP for

red-purple. The value number of a color follows the hue designation. For

example, YG/7 is a yellow-green with a value matching step 7 of the gray scale.

The intensity number comes last; thus, YG/7/4 indicates a yellow-green hue at

a value of 7 and intensity of 4.

C O L O R S C H E M E SThere are several color schemes; some simple while others are very complex.

|As expected, the more complex a color scheme the more skill is required

to achieve a successful design. The concept of harmony lies behind the

development of each color scheme.

Neutral (monotone) Color SchemesA neutral or monotone color scheme consists of various tints and shades of a

neutral color such as black, white, gray, beige, tan or taupe. A neutral scheme

is easily composed by selecting a neutral then building upon several values of

that neutral. This scheme is often used as a backdrop for a striking accent

color or for non-competing backgrounds when an important element is

displayed, such as artwork. Neutral color schemes can become monotonous

if not accented properly; however, a successful scheme can be considered

sophisticated, elegant, and refined. They are used when a soft but formal

space is desired, such as a hotel, bank or museum.

13

Neutrals

9

Monochromatic Color SchemesThe monochromatic color scheme consists of one chosen hue with several

values and intensities of that hue used to create depth and interest. Spaces with

a single color can look dramatic, but this scheme my create monotony. The

monochromatic color scheme works well in spaces where we don’t spend a

great deal of time, for example, a private hotel suite or an upscale retail store.

Analogous Color SchemesUsing colors that are adjacent on the color wheel have close relationships and

create analogous color schemes. Blue-green, blue, and blue-violet make up an

analogous scheme. This scheme easily creates harmony, is usually vibrant, and

works well in spaces that encourage high energy such as daycare centers and

sports facilities.

Complementary Color SchemesColors that are located across from each other on the color wheel are

complementary and thus make up a complementary color scheme. For

example, red and green, yellow and purple, and blue and orange are

complements. Complements have the greatest intensity when seen together

and can be extremely pleasing. When designed correctly, the scheme brings

feelings of energy and cheerfulness. However, it can be difficult to succeed at

this scheme for it can become too bright or garish if the colors are not properly

balanced.

Fast food restaurants often use complementary color schemes. The result is an

interior that exudes high energy, but also does not make the customer too

comfortable. The effect is that many are attracted, but at the same time there is

the high turnover necessary to achieve profit.

14

Complementary Color Schemes

Analogous Color Scheme

Monochromatic Color Scheme

9

Split Complementary Color SchemesThe split complementary color scheme consists of one hue with the two huesadjacent to its complement. The two adjacent hues are harmonious while the complement adds a vibrant contrast. When used together, the palettes of yellow-green, red, and blue-green, will create a split complementary color scheme.

15

Blue-Green

Yellow-Green

Red

9

Triad Color Scheme

The triad color scheme incorporates three hues that are equally spaced on the

color wheel. The most common triad scheme is used with the primary colors -

red, yellow and blue in energetic spaces such as schools, sports arenas, and

movie theaters. Varying the values of triad hues can create a sophisticated look,

but this is difficult to master without creating harshness and confusion within

a space.

Tetrad Color Schemes

The tetrad color scheme incorporates four hues that are equally spaced on the

color wheel. Vivid tones give a lively feeling, while muted tones bring a subtler

mood. Tetrad color schemes are rare and difficult to produce since they often

create harsh and confusing spaces.

A P P L Y I N G C O L O R I N F A C I L I T I E S

The basics of incorporating color apply to every type of interior space. Yet,

many variables interact with color (e.g., location, the size of the space, and

natural and artificial lighting). The Federal Standard 595B color fandeck

may be used as a reference when selecting colors. The fandeck may be

ordered from the General Services Administration (GSA) catalogue, stock

#7690-01-162-2210.

The following generalizations are suggested for each space type.

Offices – General

The objective for designing an office is to create an environment that promotes

productivity for the many users who work long hours. Color plays an

important role in stimulating productivity without creating distraction. Bright

warm colors work best in areas where physical tasks take place, and calmer,

cooler colors work best where visual and mental tasks are performed. Livelier

colors should be applied in limited areas with related quiet tones in larger

spaces. In multi-floor or large offices, each floor or department can possess an

identifying color tonality, with strong colors in lobbies, corridors, and entrance

points, while related softer hues are used in the general office areas.

• Desks and work surfaces – light toned neutral desks and work surfaces are

good choices since neutrals are not distracting, and their low brightness

contrast (glare) minimizes eye fatigue. Light gray, tan, beige, taupe and ivory

are soft colors that work well and have a light reflectance of approximately

30%.

• Flooring – medium to light toned floor surfaces are suggested to reduce

brightness contrast between the floor color and tasks or work surfaces. The

light reflectance range should be 20% – 50%. The color of soil in a given

geographical region plays a part in the color selection of flooring so as to

camouflage soil.

16

Typical Office

Child Development Center

Hanscom Air Force Base, Massachusetts

Gossick Leadership Center Renovation

Arnold Air Force Base, Tennessee

9

• Walls and panels – a light reflectance range of 40% - 60% is suggested forwalls and panels. An accent wall, in a soft hue, can be added for interest andto relieve monotony. Deep colors may be used behind a desk, or in frontalview, but should not be used on a window wall due to the high contrast.

• Ceilings – bright ceilings of white are functional for good light reflectance.

• Corridors – bright, bold, and contrasting colors may be added to corridorsfor visual stimulation.

• Doors – various colors for doors can be used anywhere.

• Private offices and conference rooms – variations of colors may be used inprivate offices and conference rooms. Avoid use of dark colors in spaces withlow light levels. However, dark hues, when balanced with lighter hues,complement spaces that have an abundance of natural and artificial light.

Industrial PlantsColor is important in the industrial setting to reduce fatigue, annoyance, andto promote efficiency and safety. Certain colors in these settings also reduceabsenteeism, and improve labor morale.

Colors may offset problem areas, for example, the use of cool blues and greensare desirable in a space with excessive heat. Conversely, reds and oranges warma cold space or can compensate for the lack of natural light. Incorporating softhues, especially tints of green, may calm noisy spaces.

• General surfaces – brightness contrasts are to be considered; glossy surfacesthat produce glare should be avoided.

• Walls – colors should be in light hues; however, a tinted accent hue with areflectance of 25% - 40% may be used on an end wall to reduce monotonyand lessen eye fatigue.

• Upper walls – should have a light reflectance between 50% - 70%.

• Ceilings – white should be used on ceilings to provide maximum light reflectance.

17

Building 32 RehabilitationWright-Patterson Air Force Base, Ohio

Air Mobility Command Design CenterScott Air Force Base, Illinois

9

• Colors and safety – various colors have been adopted for safety purposes in

industrial settings. Green is the choice color for machinery and equipment.

Yellow marks potential hazard areas while red indicates fire-safety equipment,

containers of dangerous materials, and control switches and buttons on

machinery. Blue indicates electrical controls and repair areas, and white

indicates trash containers, drinking fountains, and food-service locations.

Black striping indicates traffic areas, aisles, and stairways.

SchoolsStudies have shown that the proper use of color in schools plays an important

role in the performance of students. This is especially true in the early years of

children. A warm brighter, color scheme not only offers positive affects on the

academics of students, but their behavior as well.

One of the most important interior elements in schools is illumination. A goal

of effectively controlling illumination with color is to keep eyestrain and glare

to a minimum. The way to accomplish this is to keep the brightness ratios

somewhat consistent.

Walls, floors, furniture and equipment - these areas should be painted in mild

color schemes with a 50-60% light reflectance. A stronger color painted end

wall can add interest. Gray or green chalkboards can seem less drab when

surrounded by contrasting colors.

• Ceilings – white or off-white ceilings should be installed for maximum

light reflectance.

• Auditorium – several hues of warm tones are suggested, including tints

of green.

• Shops, and art rooms – light hues are appropriate and work well in

these spaces.

• Gymnasium – luminous tones work well in gyms, while colors that reflect

flattering light, such as coral, work best in locker and dressing rooms.

• School facilities such as libraries, offices and teachers lounges, should be

designed with subdued tones.

• Corridors and stairways – bolder colors may be used to offer stimulation in

these transition spaces.

18

Child Development CenterUnited States Air Force Academy, Colorado

Air Force Senior Commissioned Officer Academy

Gunter Annex,

Maxwell Air Force Base, Alabama

Health and Wellness CenterElgin Air Force Base, Florida

9

Hotels

A hotel design should present a welcome, pleasant experience for its guests.

The climate and customs of the region can add to the characteristics of the

chosen color schemes and style. For example, brightly colored tiles and fabrics

combined with white walls may suggest a tropical location.

• Lobby and lounge – the front lobby and reception desk can accept strong

use of color that creates lasting impressions. Warm colors in lobbies and

lounges provide comfort for people who will occupy these spaces for long

periods. Dark woods and marbles suggest solidity and tradition, whereas

bright saturated colors imply a casual and playful atmosphere.

• Guestrooms – colors may vary, as suggested above, to reflect climate and region.

However, the chosen color scheme should promote comfort and relaxation.

• Corridors - a lively color scheme is suggested for the corridors, incorporating

a dark color at one end to give interest when walking down a long hallway.

Medical and Healthcare Facilities

The interest of the patient is the primary concern when designing medical and

healthcare facilities. Research studies suggest that the environmental ambience

plays a significant role in the rate of patient recovery. Visual contact with the

out-of-doors, natural materials such as wood, and warm colors contribute to a

faster rate of recovery. Warmer colors in hospital rooms flatter users’ skin tones

when reflected in mirrors.

Cooler colors offer a calming ambience and are appropriate for intensive care

units. Bluish-green is a standard for operating rooms because it provides visual

relief of personnel from the red tones of blood and tissue. Cooler colors, which

calm, are appropriate for examination rooms, while warmer tones are used in

areas such as dermatology and obstetrics. However, color should be restrained

to avoid the possibility of environmental color reflection interfering with

patient diagnosis.

Food Service

Many studies have been provided by the food service industry regarding color

and the physiological responses to food and its atmosphere. For example, the

color red was found to stimulate the appetite.

In general, warm tones are comforting in restaurant settings. Colors to avoid

include black, dark gray, cold gray, strong tones of blue and violet, and

yellow-green.

19

Area Dental Lab

Peterson Air Force Base, Colorado

Iditarod Dining Facility

Elmendorf Air Force Base, Alaska

9

The style of each food service area should be taken into consideration when

applying color. Fast food establishments and cafeterias incorporate bright

colors to promote a faster pace. Fine restaurants and traditional eating

establishments are typically designed in subdued colors to promote leisurely

dining. In each case, the color of floor coverings should be selected to conceal

soiling. The color scheme should be versatile with bright lighting at lunchtime

and softer lighting at dinner.

Traditional associations of color are appropriate when serving various styles of

cuisine. Mexican, Indian and Spanish foods are associated with bright cheerful

colors, Greek with blue and white, and Italian with red, green and white.

Colors of table settings should complement the food to be served. Care must

be taken so that the space does not become a cliché.

Supermarkets apply bright colors in various areas; however, white is preferred

in the dairy section, and lighter blues and blue greens are used at the meat

counter to complement red meats. Colorful cans and other merchandise are

nicely displayed when seen against a neutral background.

Retail Outlets

Retail outlets display their merchandise in the most attractive setting to achieve

high sales volumes. Color has a strong impact on consumer reactions to

products including impulse buying.

The general rule of thumb is to use bright colors in low cost, rapid turnover

shops, and more subtle sophisticated color schemes in higher priced and leisure

shops. Discount stores often use bright colors to stimulate customers; however,

a low-end rack outlet may use white walls and gray floors to give the effect of a

discount image.

Men’s clothing shops tend to have natural wood and brown tones to promote a

club-like atmosphere. Women’s shops usually retain soft, warm tones, possibly

pastels. Bright colors used with metallic, white, black, or gray, tend to promote

electronics and other high tech products. Avoid strong color on display

backdrops and shelves that may distract from the merchandise. Light grays and

tans are good choices. Expensive jewelry and small gift items sparkle against

conservative colors.

C O N C L U S I O N

Along with man’s sensitivity to time and space is sensitivity to color. Color can

affect perception of size just as it can affect mood. It is important to wisely and

carefully incorporate color into all interior projects using it to heighten

awareness of the appearance and mood of space.

20

Air Force Senior Commissioned

Officer Academy

Gunter Annex,

Maxwell Air Force Base, Alabama

BXTRA Open Air Mall

Hickam Air Force Base, Hawaii

1

2DIS / ParsonsIan Hughes

Defining Color: Hue, Value, SaturationIn the first part of the semester, we will attempt to isolate each of the defining attributes of

color–hue, value, saturation–in order to see how each operates. You will be responsible for

knowing and demonstrating an understanding of each of these attributes. You will have the

opportunity to apply what we’ve learned during the rest of the semester.

Defining Hue• The identity of a color as it relates specifically to the spectrum. The generic names of spectral

colors are: red, orange, yellow, green, blue, and violet.

If we want to identify a color by its hue, we look for its specific relationship to the spectrum of

pure colors refracted through a prism. We ask, "is it red or red-orange...is it blue, or is it more

violet?"

The words “color” and “hue” are not synonymous. Hue is a specific attribute of color.

Reddish brown, for example, is the color brown with a red hue. Black is a color with no hue.

The hue of a given color is altered only when mixed with another hue.

Organizing HueThe spectral hues are often organized along a 360º circle, called a hue circle. Yellow is at the top

(0º), and violet is at the bottom (180º). Most hue circles have at least 6 parts: 3 primaries and 3

secondaries. The colors in between are called intermediary colors.

PRIMARY

Colors that cannot be broken down into other colors and are the building blocks for all

other colors.

SECONDARY

The middle mixtures of two primary colors.

ANALOGOUS

The colors that are next to each other on the spectrum or hue circle.

COMPLEMENTARY

Colors that are opposite,as defined by the afterimage of any given color. When mixing

pigments or inks, the secondary color of two primaries produces the complement of the

third primary (for example, red and yellow make orange, which is the complement of blue.)

Complementary relationships are crucial to the understanding of color harmony.

TERTIARY

The mixture of two complements. Also called neutral color.

HUE

2

Temperature: Warm Vs ColdTemperature is an attribute of color related to hue. Generally speaking, colors that gravitate

towards the red-yellow half of the circle are considered warm, and colors that gravitate towards the

green blue are considered cool. This is mostly by psychological association (i.e., fire = red-

yellow=warm, ice =bluish=cool).

3

Mixing Color: Additive vs. SubtractiveMixing colored light and mixing colored pigments yield two very different, indeed opposite,

results. An understanding of why this happens is important to understanding how we perceive

color and how color interacts with our environment.

MIXING LIGHT:ADDITIVE

Natural light is a mixture of all the hues in the spectrum, naturally! As easily demonstrated

with a prism (or a rainbow), the spectrum can be broken down to reveal its component colors,

which are actually electromagnetic waves of different lengths. Our eyes and brain are

designed to interpret these different wavelengths as different colors. Because of how our eyes

are designed, the colors of the spectrum can be further reduced to three primary colors: red,

blue and green. All the other colors of the spectrum result from what happens when these

colors are combined in our eyes and brain as follows:

Primaries: R, G , B Secondaries: Y (R+G) , Cyan (G+B) , Magenta (R+B)

If a single color is extracted from the spectrum, the leftover light waves combine to produce

its complement. Similarly, if more than one color is broken out of the spectrum, the resulting

combinations produce complementary pairs. Complementary pairs combine to produce white

light. This phenomenon establishes the organizing principle of complementary colors.

Whenever colored light is mixed, the resulting color is always lighter than the parent colors,

because light is being added. This is why mixing light waves is called additive. No absorption

is taking place. If all the colored light waves of the spectrum are brought back together, the

result is white light, which to our eyes appears colorless. Black is the absence of light.

MIXING COLORANTS: SUBTRACTIVE

The exact opposite happens when we mix colorants like paint or ink. All the colors of the

spectrum combine to produce black (or dark grey). That’s because light rays are being

absorbed, or subtracted.

Light waves that are not absorbed are reflected back to our eyes and perceived as color. A

surface appears red, for example, because only the red light waves are reflecting back; all the

other colored light waves are being absorbed. Our experience of color is most often a result

of subtractive mixing.

Notice that the true primaries of subtractive mixing (C, M, Y) derive from the true secondaries

of additive mixing.

1

Defining Value (synonyms: luminance, brightness)•The lightness or darkness of a color.

Black, white, and gray are colors of pure value and have no hue.

Assessing Value

Value can actually be measured as a percentage of reflected light from 100% (white, total

reflectance) to 0% (black, total absorption). A true middle gray is literally 50/50 (i.e., 50%

reflectance, 50% absorption.)

In the visual arts we are concerned with perception and not so concerned with physical

measurements of reflected light (except perhaps when setting up for a staged photograph.)

Accordingly, we use visual comparison within a given context to determine if a color is lighter

or darker than its neighbor:

! If two colors of analogous hue share an edge, you can tell they are close in value if

the edge is soft and far apart in value if the edge is hard.

! If two colors of opposite hue share an edge, you can tell they are close in value if

the edge “vibrates” or shimmers and far apart in value if the edge is hard.

Relative ValueA color’s value can also be assessed by its specific relationship to the value scale (the range of

grays from white to black, also known as the gray scale.) This is known as its relative value.

All colors, including pure hues, have a relative value. A pure yellow is close to white in its

reflectance. Pure red and green are closer to middle gray. Keep in mind that a color’s value, or

reflectance, is also influenced by surface textures.

Manipulating ValueDoing one of the following alters the value of a color, but not its hue:

! Tinting (adding white)

Ex: if red is tinted with white, the result is a pink of the same hue (red).

! Shading (adding black)

Ex: if red is shaded with black, the result is a brown of the same hue (red).

Value is not altered if a color is mixed with another color or gray of the same value.

VALUE

2

The Importance of Value

When discussing the problem of color in the context of inventing Cubist collage, Georges

Braque said, “[Picassos and I] arrived at cleanly dissociating color from form and at seeing its

independence in relation to form, because that was the main concern: color acts simultaneously

with form, but has nothing to do with it.”1

What did Braque mean exactly? In a sense, Braque is talking about the difference between hue

and value. Understanding this distinction can add enormously to our understanding of color.

The perception and representation of form is entirely dependent on value, or the contrast of

light and dark, not hue. If we subtract the perception of hue from our world, we would still

perceive form. On the other hand, if the world suddenly converted to pure hue, we would be in

big trouble!

What Picasso and Braque knew from experience has since been corroborated by science.

Recent research has shown that the part of our brain that responds to light/dark is several

inches away from the part of our brain that responds to hue. The value sensitive portion of our

brain is literally color-blind.2 Our ability to perceive depth, spatial relationships, three-

dimensionality and volume (form), as well as movement or stasis, derives from the part of our

brain that responds exclusively to differences in value without regard to hue.

All mammals perceive luminance, however only primates evolved with the ability to perceive

the colors of the spectrum between infrared and ultraviolet. Before our eyes and brain have

fully developed in infancy, we see only light and dark. In the weeks following birth, our brains

develop the ability to perceive hue. Once our brains have fully developed, hue continues to

play a secondary role to value in how we perceive the world around us.

If you are a visually sensitive individual, you may already know this intuitively. The observed

world is experienced mostly as infinite gradations of light and dark accented by equally subtle

modulations of hue. In other words, our primary visual experience is of value, not hue. Within

the last century, mechanical reproduction and color processing have added significant bursts of

saturated color to our perceptual world. The more time we spend gazing at printed and

electronic media, the more this becomes the norm. But this is a recent phenomenon, the

implications of which are interesting to ponder.

The psychological and emotional components of hue cannot be understated and go way beyond

mere perception. If we imagine life without hue—as a black and white movie, for

example—we can appreciate how important and inextricably linked the perception of hue is to

our experience of the world. As long as we are in the presence of light, we are constantly

under the influence of hue, even though we may not even be aware of it. Hue is like the spice

that makes the visual “food” we need for survival worth eating.

1 Christine Poggi, In Defiance of Painting, Yale University Press, p. 152 Margaret Livingstone, Vision and Art: The Biology of Seeing, Abrams, pp. 37-38

1

Defining Saturation (Synonyms: Chroma, Intensity)• The purity of a color.

100% saturation is defined as the absence of white, black, or gray; 0% saturation is the absence of

hue. Neutral colors are by definition low saturation, or low chroma, and can be either achromatic

(i.e., having no hue, as in the gray scale), or chromatic (i.e. having hue, as in tertiary colors).

Assessing SaturationAs with the other attributes of color, saturation is relative and therefore a matter of comparison. If

comparing ten different reds, for example, the reddest red is the most saturated.

Manipulating SaturationAdding white, black, or gray to color results in reduced chromatic intensity, or reduced saturation.

The same result occurs when mixing complements together.

Intensity vs. BrightnessSaturation can be the most difficult of color’s attributes to agree on. Picking the reddest red out of a

line-up sounds easy enough, and often it is, but what happens if white is added to make a bright

pink that appears more chromatically intense than the original? By definition, adding white makes

a color less saturated, so what gives? Even more confusing is when a violet or green pigment in its

most saturated form (right out of the tube) is so dark that you can’t really perceive its hue until you

add white. So which of the two colors has more chroma, the one that looks almost black or the one

with white in it?

It can be hard to separate brightness and intensity. When white is added to a dark color, it becomes

brighter, which is technically specific to value. When hue is added to a color (providing it is not a

complement), it becomes more intense, which is technically specific to saturation. The variables of

different colorants can create anomalies of color so that a brighter, less saturated color can appear

more intense, even if that sometimes amounts to a contradiction in terms.

Suffice it to say that color by its very nature cannot be defined like words in a dictionary. After all,

it is literally a matter of perception.

SATURATION

Color Harmony for…Cailin Boyle (Paperb…

$10.00

Pantone Web Colo…Mordy Golding, Dave…

$0.01

Web Color Expert:…Keith Martin (Paperb…

$12.00

Color - Messages …

Leatrice Eiseman (P…

$26.39

Pantone Guide to …

Leatrice Eisemann (…

$27.04

Privacy

Color Forums | Privacy Statement

Home | Order | Download | Color Lab | FAQ | Support | About Tiger Color

Home > Color Lab > Color Theory

Basic color schemes- Introduction to Color TheoryWith colors you can set a mood, attract attention, or make a statement. You canuse color to energize, or to cool down. By selecting the right color scheme, youcan create an ambiance of elegance, warmth or tranquility, or you can conveyan image of playful youthfulness. Color can be your most powerful designelement if you learn to use it effectively.

Content

The Color Wheel

Primary, Secondary and Tertiary Colors

Warm and cool colors

Tints, Shades, and Tones

Color Harmonies - basic techniques for creating color schemes

- Complementary

- Analogous

- Triadic

- Split-Complementary

- Rectangle (tetradic)

- Square

Colors affect us in numerous ways, both mentally and physically. A strong red color hasbeen shown to raise the blood pressure, while a blue color has a calming effect.

Being able to use colors consciously and harmoniously can help you create spectacularresults.

The Color Wheel

Recommended reading

Basic color schemes: Color Theory Introduction http://www.tigercolor.com/color-lab/color-theory/color-theory-intro.htm

1 of 6 10/20/2010 11:39 AM

The color wheel or color circle is the basic tool for combining colors. The first circularcolor diagram was designed by Sir Isaac Newton in 1666.

The color wheel is designed so that virtually any colors you pick from it will look goodtogether. Over the years, many variations of the basic design have been made, but themost common version is a wheel of 12 colors based on the RYB (or artistic) color model.

Traditionally, there are a number of color combinations that are considered especiallypleasing. These are called color harmonies or color chords and they consist of two ormore colors with a fixed relation in the color wheel.

ColorImpact is designed to dynamically create a color wheel to match your base color.

Primary, Secondary and Tertiary ColorsIn the RYB (or subtractive) color model, the primary colors are red, yellow and blue.

The three secondary colors (green, orange and purple) are created by mixing twoprimary colors.

Another six tertiary colors are created by mixing primary and secondary colors.


2 of 6 10/20/2010 11:39 AM

The above illustration shows the color circle with the primary, secondary and tertiarycolors. Click on the labels to turn the colors on / off.

Warm and cool colorsThe color circle can be divided into warm and cool colors.

Warm colors are vivid and energetic, and tend to advancein space.

Cool colors give an impression of calm, and create asoothing impression.

White, black and gray are considered to be neutral.

Tints, Shades, and TonesThese terms are often used incorrectly, although they describe fairly simple colorconcepts. If a color is made lighter by adding white, the result is called a tint. If black isadded, the darker version is called a shade. And if gray is added, the result is a differenttone.

Tints - adding white to a pure hue:

Shades - adding black to a pure hue:


3 of 6 10/20/2010 11:39 AM

Tones - adding gray to a pure hue:

Color Harmonies- basic techniques for creating color schemesBelow are shown the basic color chords based on the color wheel.

Complementary color schemeColors that are opposite each other on the color wheelare considered to be complementary colors (example:red and green).

The high contrast of complementary colors creates avibrant look especially when used at full saturation. Thiscolor scheme must be managed well so it is not jarring.

Complementary color schemes are tricky to use in largedoses, but work well when you want something to standout.

Complementary colors are really bad for text.

Analogous color schemeAnalogous color schemes use colors that are next to eachother on the color wheel. They usually match well andcreate serene and comfortable designs.

Analogous color schemes are often found in nature andare harmonious and pleasing to the eye.

Make sure you have enough contrast when choosing ananalogous color scheme.

Choose one color to dominate, a second to support. Thethird color is used (along with black, white or gray) as anaccent.


4 of 6 10/20/2010 11:39 AM

Triadic color schemeA triadic color scheme uses colors that are evenly spacedaround the color wheel.

Triadic color schemes tend to be quite vibrant, even ifyou use pale or unsaturated versions of your hues.

To use a triadic harmony successfully, the colors shouldbe carefully balanced - let one color dominate and usethe two others for accent.

Split-Complementary color schemeThe split-complementary color scheme is a variation ofthe complementary color scheme. In addition to the basecolor, it uses the two colors adjacent to its complement.

This color scheme has the same strong visual contrast asthe complementary color scheme, but has less tension.

The split-complimentary color scheme is often a goodchoice for beginners, because it is difficult to mess up.

Rectangle (tetradic) color schemeThe rectangle or tetradic color scheme uses four colorsarranged into two complementary pairs.

This rich color scheme offers plenty of possibilities forvariation.

Tetradic color schemes works best if you let one color bedominant.

You should also pay attention to the balance betweenwarm and cool colors in your design.


5 of 6 10/20/2010 11:39 AM

Square color schemeThe square color scheme is similar to the rectangle, butwith all four colors spaced evenly around the color circle.

Square color schemes works best if you let one color bedominant.

You should also pay attention to the balance betweenwarm and cool colors in your design.

Copyright © 2000 - 2009 Tiger Colorcolor schemes made easy


6 of 6 10/20/2010 11:39 AM

Plug intoPhotoshop

Available now! Link

ColoRotate to Photoshop.

Sync your palettes and

share with colleagues.

LEARN MORE

Dive into color

Explore the

causes of color, as well as

color vision and art, at the

WebExhibits museum.

LEARN MORE

As humans, our color vision influences everything from our art and poetry to the colors

we paint our homes and the clothing we choose to buy. Yet, we rarely question the

mechanics of our color perception — or what we may not be able to see.

We perceive color when the different wavelengths composing white light are

selectively interfered with by matter (absorbed, reflected, refracted, scattered, or

diffracted) on their way to our eyes, or when a non-white distribution of light has been

emitted.

Visible light is merely a small part of the full electromagnetic spectrum, which extends

from cosmic rays at the highest energies down through the middle range (gamma rays,

X- rays, the ultraviolet, the visible, the infrared, and radio waves) all the way to

induction-heating and electric-power-transmission frequencies at the lowest energies.

Note that this is the energy per quantum (photon if in the visible range) but not the

total energy; the latter is a function of the intensity in a beam.

We can detect the range of light spectrum from about 400 nanometers (violet) to about 700 nanometers (red). We perceive

this range of light wavelengths as a smoothly varying rainbow of colors, otherwise known as the visual spectrum.

What Happens in the Eye?

The eye is often compared to a camera. But it

might be more appropriate to compare it to a TV

camera that is self-focusing, has a self-cleaning

lens, and has its images processed by a computer

with millions of CPUs. Light from an external

object is refracted as it moves through the

cornea, and then moves on to the pupil, which is

English Español Deutsch

Home Learn about color Tour Your account Store About

How do we perceive color?

Overview What is color? How do we perceive color? Color Models Learn more

How do we perceive color? | ColoRotate http://learn.colorotate.org/how-do-we-perceive-color.html

1 of 3 10/20/2010 11:58 AM

controlled by the iris. The light is again refracted by the lens, which projects an upside-down image on the retina, or the

rear, inner surface of the eyeball. There, it is absorbed by pigments in light-sensitive cells, called rods and cones. These

photoreceptors convert light (photons) into electro-chemical signals, which are then processed by neural circuits in the

retina and transmitted to the brain.

There are approximately 6 million cones in our retina, and they are sensitive to a wide range of brightness. The three

different types of cones are sensitive to short, medium and long wavelengths, respectively. Cones are active at high light

levels and allow us to see color and fine detail directly in front of us. They can adapt to widely varying colors and

illumination levels, but don’t work well in low light.

Our retina’s 125 million rods are used only in dim light, and are monochromatic, so they don’t perceive color — only black

and white. Rods account for our peripheral night vision, but don’t enable us to see well when we’re looking straight ahead.

The retina consists of a very thin layer of nerve cells and contains two

types of photoreceptors, rods and cones. Ganglions are also located in

the retina. This graph shows the sensitivity of the different cones to

varying wavelengths.

The three types of nerve cells that detect bright light

span the "short," "medium," and "long" wavelength

ranges.

Retinal ganglion cells calculate color

But the cones in our eyes are just the beginning of the color story. Ganglions are a type of neuron located in the retina that

receive signals via various intermediate cells from the cones and rods. They are the cells that transmit information to the

brain. Why all the fuss?


2 of 3 10/20/2010 11:58 AM

The ganglion cells add and subtract signals from many

cones. For example, by comparing the response of the

middle-wavelength and long-wavelength cones, a

ganglion cell determines the amount of green-or-red.

The result of these steps for color vision is a signal that is

sent to the brain. There are three signals, corresponding

to the three color attributes. These are:

The amount of green-or-red

the amount of blue-or-yellow; and

the brightness.

Using ColoRotate, you can view colors in these three

dimensions.

Working in 3D makes colors blossom.

Color’s 3D nature makes it difficult to accurately assess color on a flat paper or screen. With ColoRotate, you aren’t limited

to moving colors around a flat color circle. Instead, you can explore all kinds of clusters and color arrangements. It’s fun,

and it will give you new ideas for fresh and inviting color harmonies and color palettes. ColoRotate also allows you to

define colors using slider controls for most color theories.

Copyright © ColoRotate and IDEA. All Rights Reserved. Learn about color Discussions Contact Us Terms Of Service


3 of 3 10/20/2010 11:58 AM

Plug intoPhotoshop

Available now! Link

ColoRotate to Photoshop.

Sync your palettes and

share with colleagues.

LEARN MORE

Dive into color

Explore the

causes of color, as well as

color vision and art, at the

WebExhibits museum.

LEARN MORE

English Español Deutsch

Home Learn about color Tour Your account Store About

Color Models

Overview What is color? How do we perceive color? Color Models Learn more

Color Models | ColoRotate http://learn.colorotate.org/color-models.html

1 of 5 10/20/2010 11:58 AM

Philipp Otto Runge’s color

sphere (Farbenkugel), 1810.

The sphere is shown from

the outside, and in cross-

sections.

RGB uses additive color mixing that

produces secondary colors where two

21st century color theoryFor centuries, artists and philosophers have theorized that color is three-dimensional.

Contemporary neuroscientists have confirmed this theory, finding that our sensation of

color comes from nerve cells that send messages to the brain about:

The brightness of color

Greenness vs. redness

Blueness vs. yellowness

When colors are dark or light, we perceive less variation in their vividness. We see the

maximum range of color saturation for middle-toned colors. This is why many color

models, including ColoRotate, taper the top and bottom colors and are wide in the

middle, forming a sphere or bicone.

Color Models

In color theory, color models mathematically describe how colors may be represented. A color space is one where the

components of the color model are precisely defined, allowing viewers to know exactly how each color looks.

Physical representations of the color space started with the two-dimensional color wheel that allowed you to see hue (red,

blue, green, etc.) and brightness for the various colors. Later, the concept of color solids emerged. Color solids are three-

dimensional representations of the color space. In addition to the hue and brightness in the two-dimensional model, a color

solid also shows the degrees of saturation for a particular hue. Most color solids are in the shape of a sphere, but that is

largely a matter of convenience. Color solids can be any shape.

ColoRotate is a color solid based on the HSL color model, and is designed to make it easy for even a layperson to navigate

the color space.

BACK TO TOPICS

RGB

In the mid-19th century, Thomas Young and Hermann Helmholtz proposed a

theory of trichromatic color vision that became the basis for the RGB

(red-green-blue) color model. This is an additive color model, in which the

three colors of light are added together to produce various colors.

The intensity of the light is determines the color perceived. With no

intensity, each of the three colors is perceived as black, while full intensity

leads to a perception of white. Differing intensities produce the hue of a

color, while the difference between the most and least intense of the colors

make the resulting color more or less saturated.

Electronics displays use the RGB model, which means that the colors are not

absolute, but rather dependent upon the sensitivities and settings of

individual devices. Cathode ray tube, LCD, plasma, and LED displays all use

Topics

Color Models RGB CMYK LAB HSV HSL NCS


2 of 5 10/20/2010 11:58 AM

colors overlap, while equal intensities of

all three colors produce white

the RGB model.

The 24-bit RGB model is also used to encode color in computing, where each

color’s value is specified by the intensity of red, green, and blue, respectively. In web page design, there are 216 so-called

“web-safe” RGB colors represented by hexidecimal values. Today, RGB remains the color model and standard for HTML

programming, but the prevalence of 24-bit displays allows most users to see 16.7 million colors of HTML RGB code.

BACK TO TOPICS

CMYK

Unlike RGB, which is an additive color model, CMYK is a subtractive color model. Typically used in printing, CMYK assumes

that the background is white, and thus subtracts the assumed brightness of the white background from four colors: cyan,

magenta, yellow, and black (called “key”). Black is used because the combination of the three primary colors (CMY) doesn’t

produce a fully saturated black.

CMYK can produce the whole spectrum of visible colors thanks to the process of half-toning, whereby each color is assigned

a saturation level and miniscule dots of each of the three colors are printed in tiny patterns so that the human eye

perceives a certain color.

Like RGB, CMYK is device-dependent. There’s no straightforward formula to convert CMYK color to RGB colors or vice

versa, so conversion is typically dependent upon color management systems. ColoRotate easily converts one system to the

other.

"Still Life with Crystal Bowl," Roy Lichtenstein, 1973

BACK TO TOPICS


3 of 5 10/20/2010 11:58 AM

In this three-dimensional model, the L stands for

the lightness of the color, with 0 producing black

and 100 producing a diffuse white. The “a” is the

redness vs. greenness, while the “b” is the

yellowness vs. blueness

The angle from the axis depicts the hue,

the distance from the axis depicts

saturation, and the distance along the

axis depicts value

In the bicone or diamond of the HSL

structure, all the visible colors can be

seen. These are the three dimensions in

which our brain analyzes the colors we

see. The first dimension is brightness (a

vertical slice). The hue is comprised of

LAB

Designed to approximate human vision, Lab color theory is built upon

the Munsell color system, the 1948 Hunter color space, and the 1976CIE color space. Unlike RGB and CMYK, Lab is not device-dependent.

Today, software applications use CIELAB or CIELAB D50. In this three-dimensional model, the L stands for the lightness of

the color, with 0 producing black and 100 producing a diffuse white. The “a” is the redness vs. greenness, while the “b” is

the yellowness vs. blueness.

BACK TO TOPICS

HSV

First described by Alvy Ray Smith in 1978, HSV seeks to depict relationshipsbetween colors, and improve upon the RGB color model. Standing for hue,

saturation, and value, HSV depicts three-dimensional color. If you think

about HSV as a wheel of cheese, the center axis goes from white at the top

to black at the bottom, with other neutral colors in between. The angle

from the axis depicts the hue, the distance from the axis depicts saturation,and the distance along the axis depicts value.

BACK TO TOPICS

HSL

Like HSV, HSL was described by Alvy Ray Smith and is a 3D representation of

color. HSL stands for hue, saturation, and lightness. The HSL color model has

distinct advantages over the HSV model, in that the saturation and lightnesscomponents span the entire range of values.

Based on the HSL color model, ColoRotate contains all the hues at different

levels of saturation along its horizontal plane and with variant intensity alongits vertical plane.

For example, by using the “Hue” mode, you can position colors on opposite

edges of the diamond to correspond to complementary colors. Or you canarrange the colors so their hues are triangularly positioned relative to each

other for a triadic color scheme. And, by using three dimensions when you

edit colors or palettes of colors, you can intuitively understand which colors

are similar, and which are more contrasting.

On the horizontal equatorial plane, pure saturated hues are along the

equatorial perimeter. Similar to traditional color wheel and color sphere

representations, contrasting hues are located opposite each other. As you


4 of 5 10/20/2010 11:58 AM

the second and third dimensions

(corresponding to round slices through

the diamond).

NCS colors have three values: darkness, saturation, and hue.

The hue is defined as a percentage between two of the

following colors: red, yellow, green, and blue. The NCS color

system is expressed as the percentage of darkness, the

percentage of saturation, and the percentages of two of the

opponent colors

move towards the center of the color disc (on the same plane) the color

saturation decreases toward the center, where all the colors merge into a

single gray. Moving vertically along this center, the color gradually becomeslighter towards the top (ending in white), and darker towards the bottom

(ending in black). The hues vary in intensity and saturation as you moves vertically up or down, or inwards in the diamond.

Any given hue can be varied in saturation by moving inwards or intensity (tint) by moving vertically up or down.

BACK TO TOPICS

NCS

Based on the color vision theories of Ewald Hering, the

Natural Color System is a color opponency system based onsix colors that cannot be used to describe one another:

white, black, red, yellow, green, and blue. Unlike the

additive RGB system or the subtractive CMYK system,

which are based on reactions of the eye’s color-receptive

cones, NCS colors are processed in the retina’s ganglioncells.

NCS colors have three values: darkness, saturation, and

hue. The hue is defined as a percentage between two ofthe following colors: red, yellow, green, and blue. The NCS

color system is expressed as the percentage of darkness,

the percentage of saturation, and the percentages of two

of the opponent colors.

BACK TO TOPICS

Copyright © ColoRotate and IDEA. All Rights Reserved. Learn about color Discussions Contact Us Terms Of Service


5 of 5 10/20/2010 11:58 AM

New Mexico State University

A Guide To Co lor

Guide C - 316Susan Wright, Extension Consumer Education and Health SpecialistCollege of Agriculture, Consumer and Environmental Sciences New Mexico State Univers ityThis publication is scheduled to be updated and reissued 4/06.

Color is one of the most important stimuli in the world. It affects our moods and personal characteristics. Wespeak of blue Mondays, being in the pink, seeing red, and everything coming up rosy. Webster defines coloras the sensation resulting from stimulating the eye's retina with light waves of certain lengths. Thosesensations have been given names such as red, green and purple.

Color communicates. It tells others about you. What determines your choice of colors in your clothing? In yourhome? In your office? In your car? Your selection of color is influenced by age, personality, experiences, theoccasion, the effect of light , size, texture and a variety of other factors.

Some people have misconceptions about color. They may feel certain colors should never be used together,certain colors are always unflattering or certain colors indicate a person's character. These ideas will limit theirenjoyment of color and can cause them a great deal of frustration in life. To get a better understanding ofcolor, look at nature. Consider these facts:

S The prettiest gardens have a wide variety of reds, oranges, pinks, violets, purples and yellows all mixedtogether.

S There are un-numbered shades of greens in a forest, in the desert and in the ocean.

S The sky can change its blue from moment to moment, and what begins as blue becomes pink and violet ororange and crimson as the sun sets.

S Even the soil boasts a variety of colors, from whitest white to coal black, with numerous colors in between.

Color makes life interesting.

To use color effectively, you must understand some basic color facts. There are three dimensions of color:

S Hue is another word for color. It usually indicates a modification of basic color. Red is a color; orange is areddish hue.

S Value refers to the lightness and darkness of a color. A light color is a tint. For example, pink is a tint ofred. A dark color is called a shade. Forest green is a shade of green.

S Intensity refers to the brightness or dullness of a color such as a bright yellow or a dull yellow.

QUALITIES OF COLORHue

A widely accepted theory of color is based on the idea that all colors or hues are derived from the threeprimary colors-red, yellow and blue. All other colors or hues come from mixtures of these primary colors.Thinking about colors around you and where they might be placed on a color wheel will help you see colorrelationships.

A Guide To Color http://aces.nmsu.edu/pubs/_c/C-316.html

1 of 6 10/20/2010 11:44 AM

Prim ary colors: red, yellow and blueSecond ary colors: green, orange and purpleInterm ed iate colors: yellow-orange, red-orange, red-purple, blue-green and yellow-greenGray: combination of all pigments

Further mixing of neighboring colors produces many other colors and color gradations. Mixed colors can beconsidered as relatives because they have common ancestors. You will note that any mixed color fits into thecolor wheel, according to the amount of yellow, red or blue it contains.

There are three neutrals; black, white and gray are not true colors or hues. They are achromatic colors. Blackresults from the complete absorption of light rays. White is a reflection of all the rays that produce color. Grayis an imperfect absorption of the light rays or a mixture of black and white.

Value

Value, the second dimension of color, describes the lightness or darkness of a color. You have a choice withineach color family from light to dark colors.

Colors follow a natural order. In a rainbow, yellow is the lightest color. Yellow-red or orange is somewhatdarker. The blues and purples are darkest of all. We can say that warm colors are lighter than cool colors intheir natural order from light to dark.


2 of 6 10/20/2010 11:44 AM

Intensity

The thirds characteristic of color is intensity. Intensity is the dimension of color that tells the brightness ordullness, its strength or its weakness. Intensity describes the distance of the color from gray on the colorwheel.

Colors in the outer circle of the color chart are full intensity because they are as bright as each color can be.As colors go down in brightness, toward neutral gray or no color, they are said to be dulled or low intensity.

It is easy to see the difference between vivid red and dull maroon, or between bright orange and dull brown orbeige. It is sometimes more difficult to recognize that a dusty pink is duller than a clear, fresh pink.

Warm or Cool Colors

Colors are considered warm if they contain enough yellow or yellow-red. They are considered cool if theycontain a noticeable quantity of blue.

There are warm and cool versions in each color family. Purple-red or bluish-red is the cool version of red.Aqua is an example of a warm version of a cool color because some yellow had to be mixed with thepredominately blue color.

In summary, the three qualities of color are hue, value and intensity. There can be both light and dark colorsin a bright or vivid group of colors, and light and dark colors in a dull or subdued group of colors.

TIPS FOR COMBINING HUES, VALUES AND INTENSITIESComb ine Warm and Cool Colors

Contrasting colors make each other seem more intense when used together. Warm colors make cool onesseem cooler, and cool colors make warm ones seem warmer.The duller a color becomes, however, the less power it has to make its compliment look brighter. A dull coloris more likely to emphasize, through repetition, other colors related to it. For example, a camel coat (orange


3 of 6 10/20/2010 11:44 AM

hue) would emphasize blond hair and creamy skin more that it would blue eyes (complementary color).Usually, unequal amounts of warm and cool colors are most pleasing because the color combination willcreate a unified idea of either warmness or coolness.

Comb ine Light and Dark Colors

Some contrast of light and dark is needed in a color scheme. Try combinations using only light colors, then trycombinations using only dark colors. Some variation in value is needed for interest.Strong light and dark contrasts are the most striking. For example, light cream with dark brown is morestriking than dark tan with medium brown.Make pleasing combinations by keeping the natural color in mind and combining a lighter warm color with adarker cool color.

Comb ine Bright and Dull Colors

Colors go together well when the quality of brightness is nearly the same. Brighter color combinations lookcheerful, and duller ones soft and restful. Some of the dull color combinations may appear even somber ordrab.A small amount of bright color used with subdued color can improve a color scheme. Combine a bright accentcolor with a dull-colored costume. If too much bright color is used, dull colors look even duller.

STANDARD COLOR HARMONIESColor combinations can be contrasting or related, according to their placement on the color wheel.Contrasting colors are those that lie some distance apart on the color wheel. Related color are those that lieside by side, or near one another on the color wheel. Standard color harmonies are outlined below, but manyother variations are possible.

R elated Harmonies

Related color harmonies are those in which the colors are similar. They include the one-hue (monochromatic)harmony and the analogous harmony.

Monochrome (one - hue)S Simplest schemeS Uses differences in value and intensity (such as pink, red and rose together)S Texture contrasts helpS Beware of tiresome, boring effect

Analogous (neighbors)S Shows one color running throughout the entire group of colorsS Uses different values and intensitiesS Quiet, restful effectS Warm and cool related schemes possible


4 of 6 10/20/2010 11:44 AM

Contrasting Harmonies

Contrasting harmonies are classified as complementary, double complementary, split complementary andtriad. Combinations of opposite colors on the color wheel are more difficult to use than those of neighboringcolors. Special care must be taken when using contrasting harmonies in clothing. However, when doneproperly, they are richer than related harmonies, and more satisfying to the eyes.

Comp lementaryS Two colors opposite each other on the color wheelS Reddish hues are hardest to handleS One of the complements used should be dull, light or dark, or in small amount

>Sp li t Comp lementaryS Combines a primary color with colors on either side of its complementS Cannot start with a secondary color because its complement, a primary, cannot be splitS Adjust amounts of different values and intensities


5 of 6 10/20/2010 11:44 AM

Doub le Comp lementaryS Two directly adjacent colors and their complements used togetherS Pick only one hue to be outstanding and used in largest account (dulled)S Vary intensities and values of other hues, as well as amounts

TriadS Richest harmony if well-usedS Equilateral triangles create triads such as Red, Blue, Yellow; Green, Orange, purple; Yellow-Purple,Blue-Green, Red-Purple; AND Yellow-Green, Blue-Purple, Red- Orange.

New Mexico State University is an equal opportunity/affirmative action employer and educator. NMSU and theU.S. Department of Agriculture cooperating.

Reprinted April 2001Electronic Distribution July 2001

Copyright 2005 NMSU Board of Regents


6 of 6 10/20/2010 11:44 AM

painting in neutrals

The aim of this section is to get

you to recognize grays, mix them reliably withpaints, and use them effectively in design.

neutrals in context

Let's start by putting near neutral

colors in context. The defining feature of nearneutrals is their chroma or saturation — theydon't have any.

Well, almost. Think of chroma as the balancebetween hue and value. Pure neutral tonescontain no information at all about hue: theyare achromatic or colorless, and vary only inlightness or value. Strongly chromatic colorsare so intense that the color sensationfrequently obscures the color value, whichweakens the clarity of the value structure.

Saturation or chroma is a measure of thebalance between the conflicting visualsensations of value and hue. Which meansyour basic consideration, when thinking aboutcolor saturation, is how to strike thebalance between value and hue.

What is value good for? As the dominantvisual information our vision extracts fromlight, value is essential to show the spatialform of physical objects in the worldrepresented by the painting. Value expressesthe direction and intensity of light, the purity ofthe air, the volume, shape and spacing ofobjects.

Lights and darks are able to do this becausethey neither clash nor harmonize with actualreds, yellows, greens, blues and violets. Valuestands behind color as an independentdimension. In fact, the traditional grisaille oilpainting method turns this fact into a method:it blocks out the picture in tones of gray, thenanimates distinct surfaces with transparent

technique

neutrals in context

near neutrals andcolor design

seeing color value

seeing hue bias

mixing complementarypaints

the material qualitiesof paint

handprint : painting in neutrals http://www.handprint.com/HP/WCL/tech17.html

1 of 27 10/20/2010 1:35 PM

glazes of color. In contrast, hue functions primarily to showthe quality of light and the innercomposition of objects in the world — theirmolecular or crystal structure, fine grainedsurface texture, translucency, refractivequalities, and so on. Value signals that theorange and lemon both have shiny, texturedskins; color signals their inner taste. A red anda brown apple have the same value, but we see(almost with our gut) that the brown applewon't be good to eat.

The problem for artists is that intense huesmake it difficult to see values accurately:using saturated colors has the effect ofweakening the value structure of a painting(making the relative value of colors moredifficult to see). There is a deep design reasonwhy modern artworks that emphasizeexpressive extremes of color also suppress thevalue and perspective cues of space, and whythe older style of paintings emphasizedchiaroscuro and landscape depth within alimited chromatic range. Chroma or saturationis not merely the balance between twoacademic colormaking attributes, but theboundary between two very different designapproaches to the visual richness of the world.

This "black or blue" distinction is not neat, forthree reasons. First, hue and value are linked infamiliar ways: pine trees are green but alsodark, lemons are yellow but also light. Second,our expectation under normal daylight is to seelighted surfaces as warm hues and darksurfaces or shadows as cool hues; hue seemsaligned with the warm/cool color contrast.Finally, surfaces shift from primarily hue toprimarily value depending on the illumination:in dim lighting all colors become varied shadesof near gray, and in extremely bright lightingcolors appear bleached or denatured.

The key to using dull or unsaturated passagesof color is that dull colors can accent bothvalue and hue. Because they are much closerto a pure gray than intense hues, near neutralsare easier to read as part of the value

value shows spatial form,hue shows the composition

oflight and material objects


2 of 27 10/20/2010 1:35 PM

structure; they combine with pure values.Because they still contain hue information, theyaccent or contrast with pure hues. Theyincrease each colormaking attribute, butthrough harmonious or antagonistic means.

This last effect, the antagonistic relationshipbetween dull and intense hues, can becontrolled by choosing near neutrals that areanalogous or complementary hues to thesaturated hues near them. The effects ofsimultaneous complementary contrast willcause saturated hues to appear more distinctbut sometimes less resonant than they willagainst an achromatic background. Placing thesame hues near to analogous near neutralsacts to diffuse their color power over the entirenear neutral area.

These points will become clearer in theexamples below, and once you actuallyexperiment with near neutrals in visual design.The point is that near neutrals areimportant, no matter what your style ofpainting. Using these dull mixtures effectivelymeans coming to grips with the three valuepainting challenges — seeing neutralsaccurately as values, mixing them as huesaccurately, and effectively using their combinedvalue and hue in visual design.

near neutrals and color design

Let's start with the use of near

neutrals in color design. This is the way thesubject is normally approached, and basicdesign effects provide a good context for otherproblems, such as seeing the hue bias of anear neutral accurately. Students are commonly taught the importanceof simultaneous complementary contrastin color design. However, important effectsalso arise from simultaneous analogouscontrast, in which the background color is notthe complementary hue of the saturated color,but the same or similar hue.

Some visual examples will illustrate the main


3 of 27 10/20/2010 1:35 PM

points. Again: the visual impact of colorsamples on a light transmitting computermonitor will not be the same as the visualeffect of light reflecting paints on paper. Treatthese examples as illustrative.

First we consider saturated color samples fromthe twelve tertiary points of the visual colorwheel, displayed against a constantachromatic mid value background (example 1).Because the lightness of highest chromacolor varies by hue, so the central colors arenot of equal lightness and chroma, thougheach hue is shown at the highest lightness thatretains the maximum saturation. (In all theexamples in this section, the central colors arearranged vertically as visual complementarypairs.)

1. saturated colors with achromatic midvalued background

central colors at maximum saturation (lightness variesby hue); background is a pure mid valued neutral

(saturation = 0%, L = 55)

Nothing surprising here. The gray backgroundsseem to vary slightly, because of thecomplementary color shifts produced by theintense hues (as explained in the section oncomplementary color contrast). Thesaturated colors all appear very lively, andmany seem to stand in front of the graybackground (with the possible exception of thepurple and red blues, which are darker in valuethan the gray).

Now, let's try to fire up the central colors bychanging the background grays to acomplementary near neutral color (example2). Again, the background is darker valuedthan all the central colors except for the purple(top left) and blue violet (bottom right).


4 of 27 10/20/2010 1:35 PM

2. saturated colors with complementarynear neutral background

central colors at maximum saturation (lightness variesby hue); background is a complementary near neutral

(saturation = 15%, L = 55)

Your mileage may vary, but I don't see atremendous difference in the quality of thesaturated central color patches (compareexamples 1 and 2). If anything, the"advancing" effect of the bright colors isaccented (now even the purple and blue violetseem to stand in front of their backgrounds),and this enhanced color contrast seems to bethe chief design impact: complementarycontrast separates colors in a pattern. Thebackground colors have been altered in thesame direction that a simultaneouscomplementary contrast would shift them, sowe have slightly intensified the color contrastwithout altering its character.

Now let's use the same central patches andbackgrounds as before, but flip the backgroundcolors vertically, so that each saturated hue isnow seen against an analogous near neutral— that is, its own hue but at lower saturation(example 3).

3. saturated colors with analogousnear neutral background

central colors at maximum saturation (lightness variesby hue); background is an analogous near neutral

(saturation=15%, L = 55)


5 of 27 10/20/2010 1:35 PM

The difference in the color effect is striking(compare examples 2 and 3). Now thesaturated hue seems to expand or diffuse intothe dull background, uniting with it in a qualityof shared glow or influence, but not achromatic quality so much as a unity of moodor light. The metaphor of light seems justifiedby the significant apparent shifts in value andcolor temperature that occur in somebackground colors — the warm colorbackgrounds in particular — and the apparentchroma increase in the backgrounds,producing an illusion of greater hue differencesfrom one background to the next. Yet thesense of color harmony seems greater acrossthe example as a whole.

If you compare the dull backgrounds in theprevious two figures (backgrounds that areexactly the same, just placed around differentsaturated colors), you will see that the effecton the dull colors is very noticeable. In effect,analogous dull colors act as colorresonators, vibrating in harmony with theirmore intense color neighbors and gaining inapparent saturation as a result.

These backgrounds were set to a constant midvalue, which makes them darker than all buttwo of the central saturated squares. Whathappens when the dull background colors aregenerally light valued and often lighter than thesaturated central colors (example 4)?

4. saturated colors with complementarylight valued background

central colors at maximum saturation (lightness variesby hue); background is complementary near neutral



6 of 27 10/20/2010 1:35 PM

In this example the backgrounds are lightervalued than all the saturated colors exceptyellow (top right), and the greens and bluegreens (bottom left 4 samples).

Here the results are mixed. For the very lightvalued greens and blue greens, the backgroundis of a very similar value but not lighter, so thedifference in chroma between the backgroundand central square is interpreted as an increasein luminosity, and the central colors appearbrighter. For the central squares that aredarker valued than their backgrounds, thesimultaneous lightness contrast causesthem to appear even darker, and thisdarkening has an apparent effect on thechroma as well, making the colors appearduller. As a result, the dark warm hues functionless effectively as color accents, and the lightcool hues more effectively, when placed withinlight valued complementary contrasts.

Now let's flip the backgrounds again (example5). The yellow, greens and blue green are stilllighter valued than their backgrounds.

5. saturated colors with analogous lightvalued background

central colors at maximum saturation (lightness variesby hue); background is analogous near neutral


Now all the saturated colors are slightlyenhanced, and the backgrounds are brightenedeven more: the whole array appears moreluminous, and every color (central squares andbackgrounds alike) has a richer, warmerpresence. This is especially apparent in thedarker central colors, where the stronglightness contrast is softened by the analogoushue relationship.


7 of 27 10/20/2010 1:35 PM

The comparisons so far indicate that lightnessand chroma contrasts have differenteffects, depending on hue. The lightnesscontrast is negligible for the saturated greenand blue green hues, but very strong for thesaturated warm hues and reddish blue. Redand red orange (top row, center two squares)appear especially affected.

I said earlier that this is because the lightnessof the maximum saturated color varies fromone hue to the next. We can explore thisrelationship further by making the backgroundcolor the same lightness as the central square,with the background either a complementaryhue (example 6) or an analogous hue (example7).

6. saturated colors with complementarynear neutral background of equal value

central colors at maximum saturation (lightness variesby hue); background is complementary near neutral(saturation=15%, lightness equal to central square)

7. saturated colors with analogousbackground

of equal valuecentral colors at maximum saturation (lightness variesby hue); background is complementary near neutral(saturation=15%, lightness equal to central square)

Comparison of these examples with each othersuggests that the chroma and hue shifts forboth saturated and near neutral colors have


8 of 27 10/20/2010 1:35 PM

been minimized. This reduced contrast is alsoapparent when these examples are comparedto earlier examples with dark backgrounds ofidentical lightness (examples 1-3). (Tocompare with earlier examples, open this pagein side by side browser windows, and align theexamples you want to compare in eachwindow.)

In other words, simultaneous colorcontrasts are minimized in colors of equallightness. Of course, part of this contrastreduction is due to the greater variation inlightness across the whole array of colors:central colors are "merged" with theirbackgrounds to accentuate the lightnessdifferences across the backgrounds. But wenotice too that complementary color contrastsdo not produce any significant hue shifts in thecentral squares, and analogous backgroundshave lost almost all their resonance (indeed,the yellow green at lower left seems todisappear into its analogous background).Lacking any value contrast to start with, colorvision is not stimulated to accent the contrastson hue or chroma.

Finally, we can minimize the differencesbetween central squares and backgrounds onboth value and chroma to see how huecontrasts work for "average" (moderatelysaturated, mid valued) color samples. Here arethe color examples again, with complementarycolor backgrounds (example 8) and withanalogous color backgrounds (example 9).

8. moderately saturated colors withcomplementary near neutral background

central colors of equal saturation and lightness(saturation = 50% lightness of 60); background is

complementary near neutral (saturation=15%,lightness of 55)


9 of 27 10/20/2010 1:35 PM

9. moderately saturated colors withanalogous near neutral backgroundcentral colors of equal saturation and lightness

(saturation = 50% lightness of 60); background iscomplementary near neutral (saturation=15%,

lightness of 55)

Several things seem to be happening at once.First, the relationship between lightness andchroma across different hues means that oncewe fix the lightness of the central squares to asingle value, some hues will appear lighter ordarker than others based on chromadifferences alone. Thus, the hues that have thehighest chroma at mid to low values (blueviolet, far right in bottom row, or red andorange, middle of top row) appear relativelybright, but the hues that have the highestchroma at high values (yellow, far right of toprow, and greens, middle and left of bottomrow) have their chroma reduced by the darkervalue and appear relatively dull. These are notcolor shifts due to contrast effects, but areinherent to the chroma/lightness relationship ofeach hue, and are inescapable when we try tocompare effects across different hues.

That said, the complementary color contrastcauses all the moderately saturated colorswatches to appear relatively more distinct. Bycomparison, the yellow, green and blue greencentral squares are almost lost against theiranalogous color backgrounds, although allhues are more "merged" with their analogousbackgrounds, as they are so similar in value.Once again, complementary color contrastserves primarily not to enhance individualhues, as "color theory" likes to put it, but toclarify visual textures or patterns amongmoderately saturated and dull colors.


10 of 27 10/20/2010 1:35 PM

Third, because the value contrasts have beenminimized, the chroma and hue shifts arereduced as well. Even so, the near neutralbackgrounds seem to receive a larger hue andvalue shift from the contrast than themoderately saturated colors. In general, colorswith higher chroma induce shifts ratherthan receive them. This effect seems to holdtrue, even when the most saturated colors areonly moderately high in chroma.

Many more examples could be added todemonstrate the interactions or mutual effectsamong hue, value and chroma. At this point itwill be most useful for you to repeat theseeffects, using either colored construction ororigami papers, or squares painted withwatercolors. The most important designprinciples we can take away from the presentexamples include the following:

• The size of color shifts dependsprimarily on the value contrast betweencolor areas. Value acts as the determinant ofother shifts: where value contrasts are large,hue and chroma differences are muted; wherevalue contrasts are small, chroma shifts areaccented. (For discussion of the relative powerof value, chroma and hue in simultaneous colorcontrasts, see the section on simultaneouscolor contrasts.)

• Light valued backgrounds are morepowerful than dark valued backgrounds.In general, when there is already a strongchroma contrast between two color areas, alight colored near neutral area is interpreted bycolor vision as if it were information about theilluminant, and this "illuminant" color affectsnearby saturated colors in the same waycolored lighting would (enhancing analogoushues, and neutralizing complementary hues).The chroma enhancing effect of analogous,light valued backgrounds is greatest for mid tolight valued saturated colors; dark valuedsaturated colors will appear darker and duller,as if they were interpreted as shadows ratherthan the illumninant.

• Lightness or chroma contrasts vary by


11 of 27 10/20/2010 1:35 PM

hue. We found that light valued near neutralbackgrounds produced the strongest effect ofenhanced luminosity in the saturated hues thatwere also light valued — yellow, greens andblue greens. Dark valued near neutrals producea similar effect for dark valued saturated hues.Roughly, when value differences are verysmall, chroma differences enhance apparentchroma; when value differences are very large,chroma differences affect apparent value.

• Analogous and complementary contrastshave different effects. Complementary colorcontrasts serve to separate unrelated colorareas in patterns or complex visual textures,especially when all colors are moderatelysaturated. Analogous color contrasts serve tounite unrelated color areas and reinforce theircommon hue by an apparent increase insaturation, especially when the lighter valuedcolors are unsaturated.

• Analogous relations are more powerfulthan complementary relations. Theanalogous, light valued near neutralbackgrounds combine with the saturated colorsto suggest a colored illuminant, stronglyenhancing the sense of color richness and colorunity.

• Near neutrals show greater apparentshifts. All other things equal, the near neutralbackground shows a larger color shift inducedby the saturated color than the saturated colorshows a shift caused by the near neutralbackground. This shift is greater for analogousthan complementary colors, and is greater forlighter valued colors.

As I've already suggested, these generalprinciples are less effective than actualexperience with color mixing. It turns out thisis also true when we look at an even simplerproblem: recognizing color values accurately.

seeing color value

There are two challenges to

seeing near neutral colors accurately:


12 of 27 10/20/2010 1:35 PM

identifying the color value (on a value scale),which we'll look at now; and identifying thehue bias in dull or near neutral color,discussed in the next section.

Our natural tendency is to take a oneproblem/one solution approach to life, but theproblem of recognizing color values is not aneasy one to solve.

A standard trick is to "squint" or narrow youreyelids when looking at a landscape or still life,which supposedly helps you to see the valuesmore clearly. In a way it does, because itreduces the overall luminosity of the visualfield, which in turn lowers the apparent chromaof all the colors — and colors lower in chromaare easier to read as pure values.

Another trick is to carry three slide framesfitted with red, green and blue filters or coloredcellophane. Each transparency will cause thehues similar to it to appear at their naturalvalues, and all other hues to appear darker andcloser to gray. The green filter is especiallyeffective, since it is neither warm nor cool, andso cancels out the effects of color temperature.Using all the filters, one after another, will helpyou to separate color values from the effects ofhue and chroma.

All these tricks are more useful in analyzing theactual values of the motif or subject you arepainting. I feel the best approach for learningthe value of color mixtures is to use theartist's value wheel to select a triad ofsimilarly valued paints (green gold, orange andturquoise for light valued paints, quinacridonecarmine, phthalo green BS and cobalt bluedeep for dark valued paints, etc.), and mixcolor circles of similar value. The illustrationshows four of these triad circles, and belowthem the same images in a pure gray scale.


13 of 27 10/20/2010 1:35 PM

color circles made of similar valued triads

This approach has one great merit: it helps youto learn the standard value for each hue youuse, without guesswork. The artist's colorwheel is based on spectrophotometric colormeasurements of paint pigments acrossseveral different brands of watercolors, so thevalues assigned to pigments are highly reliable.No guesswork is involved.

An added benefit is that, with minor variations,the mixtures of any equal valued colors youchose for a color circle will have the same valueas the pure pigments. You also learn thecharacteristic value of a range of color mixtures— green gold with turquoise, carmine withphthalo green.

The final aid is, of course, the value scale.Some painters suggest you make such a scaleyourself, through successive layers of dark orblack paint. I strongly recommend you buy astandard photographer's gray scale (forexample as manufactured by Kodak), sold inany good camera store or photographic supplystore. The merit is that these gray samples areaccurate, and have a dull glossy finish thatappears relatively constant across a wide rangeof illumination. To use the gray scale, simplyhold it alongside the color area you want toevaluate; you can also use a paper punch toput small holes along the inner edge of eachgray swatch, and look at the color throughthese holes (this eliminates the visuallyconfusing effects of contrast colors near thearea you want to evaluate).

What do these various tricks or tools amount


14 of 27 10/20/2010 1:35 PM

to? Nothing more than patient, trial and errorlearning. Some artists are naturally endowedwith a light sensitive eye. For the rest of us,seeing values accurately is a very complexvisual skill that requires long and patientpractice.

The advantage of using the artist's color wheel,or colored filters, is that you apply a consistentmethod to many different color samples (inpaints or the real world). They key to relativelypainless learning is to create these consistentmethods and use them in many differentsituations.

seeing hue bias

Finding the hue bias in a dull or

near neutral color is another subtle problem incolor perception. The problem is made moredifficult because it is hard to find near neutralcolor samples with which to train one's coloreye.

The near neutral color samples in this sectionare meant to be illustrative only. I recommendthat you buy an inexpensive color atlas, suchas the The New Munsell Student Color Setor the Process Color Manual, to assist you inrecognizing and distinguishing among greens,reds, yellows or blues that are very close togray.

One approach to hue discrimination might be tostart with the saturated color circle, with itscomplete color range, and look at colorsamples of decreasing chroma or saturation atconstant value, to see what a dull blue or a dullred looks like.


15 of 27 10/20/2010 1:35 PM

a palette of near neutrals (CIELAB L = 65)

We first notice that the different hues areharder to distinguish as near neutrals than assaturated colors. The hue gradations seem tomelt away as the samples shift toward lowerchroma.

The hue fading effect varies by hue: theturquoise and greenish blue samples appearbright around a chroma of 35, while thesamples of yellow or yellowish green appeardull. At different lightness values than theCIELAB L of 65 chosen for this example, othercolors would appear more intense at a chromaof 35. So the hue fading depends both onthe hue and the value we are considering.

With those basic cautions in mind, let's startwith a pure achromatic hue and workoutwards. This is closer to the actual situationyou face when painting, which is identifying anear neutral hue without a strong hue near it toaid in recognition.


16 of 27 10/20/2010 1:35 PM

the circle of grays

The circle of grays starts with a pureachromatic sample of lightness 50. It issurrounded on four sides by samples at achroma of 4, then at a chroma of 7 atlightnesses of 50 and 80. The color samplesaround the circumference identify the huealong each "spoke" of the circle.

Working outwards in this way, it's obvious thatour color categories have broken down: wecan't distinguish among these grays with thesame precision that we can distinguish amongthe colors in the outer circle. We need to learna new hue circle, an near neutral hue circle,as our framework for identifying near neutralcolors.

Part of the problem is that we must have newcolor terms to talk about the differences amongthe grays. The hue terms we use for thesaturated colors just don't apply. There is avery obvious difference between the red violetand blue violet, but the corresponding grayslook pretty much the same. What should wecall this dull color?

To find an answer, try to divide the grays in the


17 of 27 10/20/2010 1:35 PM

outer or middle circle into groups of similargrays. How many groups do you come upwith? How sure of the groups are you?

There are little or no differences among thesamples of chroma 4. Differences mightbecome apparent, through color contrasteffects, if these samples were placed next tomore intense color samples. At chroma 7,there does seem to be a difference between"warm" colors (magenta through yellow) whichappear as a dull brown, and "cool" colors(green through blue) which all seem to be adull green. At a lighter value (L=80), thiscontrast is more obvious, and the violets (redviolet to blue violet) seem also to form adistinct grouping.

These groups seem roughly to correspond tothe three additive primaries of scarlet,green and blue violet. It seems that color visioncannot achieve a reliable hue recognitionbecause the outputs from the R, G and B conesare so nearly equal; but it can at leastrecognize which of the three cones isresponding most strongly. The hue separationbecomes clearer at lighter values, because atthis value all the cones are much more active,so the slight differences between them becomemagnified.


18 of 27 10/20/2010 1:35 PM

the circle of grays (hue symbols omitted)

If we look at samples with a chroma of 14, thehue differences are distinct for each hue at alightness of 90, and are more distinct at alightness of 50. The warm colors and greenblues/blue greens still seem to form two largeclusters, but the hue transitions from orange togreen and from blue to magenta are moredistinct. Increasing the chroma further unfoldshue differences at darker and darker values —depending on which hue we are looking at.

These comparisons suggest the followingmethod for identifying the hue of near neutralcolors, whether in mixed paints or in thesurfaces of the real world:

1. Warm or cool? As we've seen, this is themost robust color judgment, even in nearneutral colors. If you cannot make this basicdistinction, then the color is either a trueneutral, or it is a very dull green or violet.

With paints, lightening the color mixturewith white paint or water can assist in coloridentification, as this brings the luminosity upthe point where reliable hue differences appeareven at very low chroma. On natural surfaces,look at the surface area that is most stronglyilluminated. (If the reflected light is dazzling,look at areas that are illuminated indirectly.)

2. Closest anchor. Proceed to narrow downthe location of the color by choosing betweenthe widest possible hue alternatives. If it is awarm color, ask yourself if it is closer to yellowor magenta; if a cool color, whether it is closerto turquoise or blue violet. Then continuedividing the color alternatives by halves: if youdecide it is closer to yellow, then ask whether itis closer to yellow or orange; if orange,whether closer to orange or deep yellow? Stopwhen the hue choice seems arbitrary oruncertain.

3. Saturation. You've located the hue; thedifficulty in making that judgment gives you asense for the color's chroma or intensity. Try to


19 of 27 10/20/2010 1:35 PM

imagine a gray and the purest imaginary hue ofthe same value, and locate the color in yourimagination between these two extremes.

4. Adjacent color. Once you have made asspecific a hue recognition as possible, considerthe contrast effects induced by adjacent colors.A greenish gray next to a magenta will appearless saturated and darker than it would appearin isolation; the same gray next to a blue greenwill appear more saturated and lighter. Hueshifts will also be present.

5. Value. You identify the value of the hue lastof all, because the apparent value of colorsvaries by hue, and you may need to adjust forthis mentally when determining your colormixture.

6. Range of Values. The last step to considerthe place of the color value in the overall valuestructure of the image. This is also related tothe visual environment in which you are tryingto make the color judgment. Is the lightingstrong, or weak? Are your eyes somewhatblinded by light, or is the surface darklyshaded? In dim light you may want to makevalues lighter than they seem; in bright lightyou may want to paint the colors less saturatedthan you would normally. (Some of theseissues are explained at the page on light inthe world, and at the page on value design.)

I emphasize again that learning to recognizeand then mix near neutral hues is a slowprocess. It goes hand in hand with your colormixing skills, your knowledge of the effects oflight and color contrast on color judgments,and your experience in making paintings.

mixing complementary paints

Any three paints that define a

mixing triangle which encloses the center orneutral point of the color wheel can create aperfect gray if mixed in the right proportions.

There are also many combinations of twopaints that can mix a neutral or gray tone.These are subtractive complementary


20 of 27 10/20/2010 1:35 PM

colors, or mixing complements. These colorcombinations are both convenient (two paintsare easier to work with than three) andeffective (two paints can often mix a darkerneutral than three). Most artists memorize theimportant combinations as part of their colormixing lore.

I learned over my first few years of teachingmyself to paint that much of the currentlyavailable information about mixingcomplements in watercolor paints is inaccurateor incomplete. Sometimes the errors are trivialand sometimes they are large.

Because your mixing intuitions depend on yourknowledge of mixing complements, I will gointo this topic in depth. (Is there any otherway?) I approached this problem methodically, andan explanation of my test methods, with acomplete listing of test results, are provided onthis page. The image at right, which showsthe mixing complementary tests for ultramarineblue (PB29), shows the gist. Each lineconnects the measured color locations ofultramarine blue mixed with every warmpigment between cadmium yellow deep andcadmium scarlet. Any mixture that passeswithin the light gray circle has a minimumchroma of 5 or less, which is to most viewersindistinguishable from a "pure" gray; anymixture that passes within the dark gray circlehas a chroma of 2 or less and really is a puregray. (At least, watercolors marketed aswhite, gray or black have a chroma withinthat range.) Three lines fall within this circle:raw umber, quinacridone gold, andbenzimidazolone orange.

The chart below shows all the mixingcomplements between warm and coolwatercolor pigments (from ultramarine violetBS to chromium oxide green). (Again, thispage presents the same information as atable. I've organized the table around the blueand green pigments, because there are fewerof them.)

near neutral mixing linesfor ultramarine blue


21 of 27 10/20/2010 1:35 PM

the watercolorist's mixing complementspigments that make "pure gray" mixtures are joined bydark lines, "near gray" mixtures by light lines; see this

page for the same information in tabular form

Before you panic: this diagram is meant tomake a single point. If the hue relationshipsbetween mixing complementary colors wereconsistent, then the lines connecting themwould not cross each other. As cool huesbecome greener, their mixing complementsshould become bluer, so lines between themwould stay roughly parallel all the way down


22 of 27 10/20/2010 1:35 PM

the chart. This is obviously not the case!

The real problem here is the ugly mess calledsubtractive color mixing, which has somememorable peculiarities:

• Nearly all the mixing complements for bluesand blue greens are limited to the warm colorsfrom carmine to deep yellow. That is, mostmixing complements lie around thewarm/cool color contrast, which is reallythe "mother of complementaries." This isemphasized by the way the mixing lines tend toslant toward the red orange center of the warmcolor range (around burnt sienna).

• With few exceptions (yellow ochre and otherdull deep yellows), yellow has no role as amixing complement. This is because yellowreflects both "red" and "green" light, and itis extremely difficult to get a reddish blue orblue violet color that can exactly cancel outboth parts of the spectrum equally.

Is Stephen Quiller incorrect to say thatultramarine violet and lemon yellow make apure gray mixture? Yes. The bluish shade ofultramarine violet (PV15) he recommends(made by M. Graham or Blockx) produces acadaverous near gray with any yellow hue —lemon yellow through deep yellow. But thesemixtures are actually a greenish gray, not atrue gray. They appear gray, however, becausewe tend to choose a cool color as a "true"gray. I used a spectrophotometer to measuremy test mixtures; Quiller used his eyes.

• The warm hue mixing complements for mostblue or green pigments cover a large hue span.This means that paint mixing cannotidentify unique complementary colors forany blue or green. Take phthalo green BS(PG7) for example: you can get a dead ondark gray by mixing it with pyrrole scarlet(PR255) or with perylene maroon (PR179).So is the "true" complementary color forphthalo green a bright scarlet or a dullcarmine? (Quiller pairs phthalo green BS withquinacridone rose PV19, which produces aviolet mixture with a minimum chroma ofaround 12.)


23 of 27 10/20/2010 1:35 PM

• Some of the mixing complementscontradict color wheel logic. Compare, forexample, the mixing complements of prussianblue (PB27) and phthalo turquoise (PB16).The perfect mixing complement for prussianblue is venetian red (PR101), and the bestcomplement for phthalo turquoise is perinoneorange (PO43). But phthalo turquoise is muchcloser to green than prussian blue, andperinone orange is also closer to green thanvenetian red: as the blue hue movescounterclockwise around the color wheel, thecomplementary color moves clockwise! Youjust can't get that to make sense on a colorwheel.

The truth is that you can't show mixingcomplements as a color wheel. No matterhow you tug and pluck, you can't unravel themess created by the substance uncertaintyof real paints. The only way to cut through theknot is to work with the color relationshipsdefined by additive color mixing, as I'vedone with my artist's color wheel, and learnthe mixing complementary relationships by rotefor the paints actually on your palette. Paintsyou don't use you don't have to know about.

the material qualities of paint

I've carried the color mixing

exercise to an unartistic extreme. But I urgeyou to verify the results, at least for paints onyour palette, for a very different reason. Mixingup your own complementary paintcombinations is a splendid way to learn thesubtle material attributes of the pigments andpaints you use.

A really unfortunate (and unintended) outcomeof learning "color theory" is the prejudicethat paints are "colors" only. This is verymuch like thinking of flowers as "colors."Skillful gardeners and flower artists, when theyplan garden beds or flower arrangements, alsothink of the size and shape of the plants, theshape and spread of blossoms, the arc andtwist of stems, and the pattern and sheen of


24 of 27 10/20/2010 1:35 PM

leaves. As a painter, you need to understandthe physical, handling and appearanceattributes of each paint or pigment you use,not just its "color." Choosing paints to createharmonious visual effects other than color isone of the hallmarks of an accomplishedwatercolor artist.

The benefit of near neutral mixtures is thatcolor is eliminated almost entirely, so paintvalue and texture is all there is to look at.Paints that you thought of as "blue" or "dark"now impress you with textures and surfaces alltheir own. You can see clearly the subtleharmonies or difficulties created by mixingdifferent types of pigments.

Here is a summary of some of the notes Imade while testing neutral mixtures:

• Mixtures of two synthetic organic pigments —a phthalocyanine with a pyrrole, for example —give the strongest, cleanest, mosthomogenous grays. These mixtures canproduce extremely even color areas andexceptionally dark grays (in some cases evendarker than ivory or carbon black), with thedrawback that they make visually boring andsomewhat dull surfaces across large areas.

• Mixtures of the cool phthalocyanines with awarm iron oxide (earth) pigment are generallyvery smooth, with a slight granularity thatlends the finished color a velvety visual texture.(As always, you must apply the color decisivelyand not fuss with it as it dries; this dulls thesurface and produces "mud.") Mixtures withred iron oxide (venetian red, light red, indianred) must be fairly diluted, however, becausethose earth pigments are thick and opaque,which can cause a dense mixture to streakwhen brushed on.

• Burnt sienna (PBr7) and venetian red(PR101) are the two workhorse pigments forneutralizing colors, but a dark raw umber(PBr7) is also often useful for reddish bluepaints.

• The very pure gray that results from venetianred with iron (prussian) blue (PB27) is


25 of 27 10/20/2010 1:35 PM

"Homer's gray." It was used with special graceby Winslow Homer to capture the darkstormy gray skies of Cullercoats and Bermuda.

• Mixtures of phthalocyanine blue or green withcadmium pigments can be very confusing towork with. The finer cadmium particles have atendency to float on the surface of the mixture,which confuses your perception of the color;you have to look through this surface to thecolor of the inner solution as you brush it outagainst the white palette. Make test swatchesto confirm the dried color appearance beforeapplying to the painting.

• Mixtures of cobalt blue or cobalt turquoisewith an iron oxide (earth) or synthetic organicpigment (the quinacridones in particular) areespecially beautiful. (The exception is ceruleanblue, which turns out unusually dull whenmixed with the earth pigments.) Cobaltpigment particles are just large enough tocreate a distinct stippled or speckled texture tothe dried color, which causes the separatepigments to appear as two interlaced colorsrather than a single homogenous hue. Thiscolor contrast is especially intense with ascarlet and turquoise, or magenta and greenpaint, and is strongest in middle grays(moderately diluted mixtures).

• The gray that results from ultramarine blue(PB29) and burnt sienna is one of the mostevocative and texturally interesting grays. It isslightly biased toward red, which gives it afundamental warmth even in its most neutraltone, and the textural effects that result fromthe wet in wet application of the two pigments,which have a strong tendency to separate injuicy washes, can be startlingly lovely.

• Grays are especially hard to mix because themargin of error is limited in all directions. Inmost mixtures it does not really matter if yourfinished color is slightly off hue from the coloryou wanted; the color still takes on its desiredrole. But a gray that varies in any directionfrom the exact color you want to mix is nolonger a gray, and may even shift temperaturefrom warm to cool. This problem arises


26 of 27 10/20/2010 1:35 PM

because of the drying shifts of thecomplementary pair: a mixture that looks spoton when wet will often dry with a hue bias. It'sbest to paint a test swatch of any gray mixture— and let it dry for at least 10 minutes — to besure of the finished color. Drying shifts arise invarious ways: with dark blue pigments —ultramarine blue, indanthrone blue and phthaloblue — because they have very large dryingshifts in lightness and saturation; with cobaltpigments, because they lose tinting strength ina mixture as they dry. An exception isdioxazine violet with sap green: both paintsindividually have large drying shifts, but thesize and direction of the shifts tend to canceleach other out, leaving the finished neutralcolor pretty much as you mixed it.

As these comments suggest, mixing nearneutral colors present slightly different mixingproblems than you encounter when mixingmore saturated colors at the outer edges of thecolor wheel. But these problems can help youlearn the essential nature of the paints andpigments more clearly.

Last revised 11.12.2007 • © 2007 Bruce MacEvoy


27 of 27 10/20/2010 1:35 PM

color theory!.pdf

Documents

primary colors yellow

warm colors

cold colors

primary colors red

intermediate colors

bright colors

clear colors

combination of colors