You are on page 1of 32

Introduction

Color Schemes (CS) is the brainchild of Gregg Patton and Eni Oken, in face of the lack of software
dedicated to help the artist make better art, specifically when dealing with color. Color Schemes is not
an application to manipulate color; instead it will help you to stimulate your creativity in order to make
your art more compelling through color combinations.
Computer graphics tools have helped artists to develop their skills and to make it easier to produce

technically perfect graphics and imagery. The same tools also allow artists to manipulate color in an
easier way, making 16 million colors available to the artist. Historically speaking, that is unheard of;
before the computer age, artists had to rely on pigment which was always difficult and cumbersome to
manipulate.
However, even with so many colors available, artists and clients alike are still unprepared to deal with
this wealth of information. It becomes necessary to go back to traditional teachings in order to
understand color theory and the basics of what makes good art.

Color is everywhere
Even though most of the time we are unaware of it, color is the phenomenon that allows us to see
shapes and perceive form. It can also cause psychological response deeper than we care to admit.
Every year, trends and fashion dictate what color we will use, and entire generations are governed by
the "right" colors. Color has deep cultural meaning: what is proper in one culture may not be for
another. And unfortunately, color is also cause for segregation.

The artist is the controller of color


As artists, we are responsible for the effect color will cause over our audience. Dark colors may
provoke entirely different reactions than bright saturated colors. As controllers of color with such
responsibility, it is imperative that we learn to manipulate it in order to make the audience react exactly

how we want them to.

Color schemes
One method to control color and the effect it will have over the audience is to choose a "color scheme",
or "color theme" before starting the project. A color scheme contains nothing more than the basic main
hues present in the project. By choosing this colors ahead of time, without the influence of form or
shape, artists are more capable of perceiving color in it's purest state.
This is an example of the color scheme for a 3D computer graphics scene:

Advantages of using a color scheme


By using a solid and well planned color scheme, you will guarantee that the audience will have a
response to color exactly as you intend it to be. Visual art work which has received careful planning
through color schemes is more likely to have a finished, designed look and therefore, more likely to be
accepted by the audience no matter how outrageous the design.
That is exactly what Color Schemes, the software, does: it helps you to come up with interesting and
appropriate color schemes for your project, by using conventional color theory as a guide to stimulate
your creativity.

Color theory
Since good understanding of color theory is such an important issue for the success of any visual
artwork (besides playing a fundamental role in the creation of the software), a few basic points are
worthy of note.

Color is subjective
First of all, it is necessary to point out that color theory is a very subjective study; there are several
theories and we can only offer what is common knowledge. Other theories will offer different views, we
recommend that you further your studies in color theory to become more acquainted with all of them
and choose the most suitable one for your needs.

Primary colors
Even though they differ, most color theories agree on a few basic points. The first one is:

There is a collection of colors, called primary colors, which are responsible for forming all the
other colors in the spectrum.

Even though this is such a simple rule, that is where the confusion starts:
depending on the medium used to form colors (light, pigment, etc), the
primary colors will vary. There are two basic systems, based on the medium,
used to classify colors:

1) Additive system: also called RGB, it is based on color made by light,


and can be easily observed in the lights of a theater, or the tiny dots of
the TV screen. The primary colors for the additive system are: RED,
GREEN and BLUE and when all of them are mixed together, they form
white, hence the name.

2) Subtractive system: also called CMY, is based on pigments and paint,


and can be observed in all kinds of paintings, prints, magazines, books.
The primary colors for the subtractive system are: CYAN, MAGENTA
and YELLOW. These colors when mixed all together form black.

Note: When the printing industry started


using this system, it was noticed that
although mixed together these three
colors form black, it does not have the
depth necessary to achieve rich, dark
colors. Therefore, they added black as a
fourth primary color, forming the CMYK
system.
CS allows you to choose colors using
both the Additive system or the
Subtractive system. Under the tab
Sliders, you will find three types of
sliders, two of which are based on the
additive (RGB) and subtractive (CMYK) systems.

3) Popular system: Although not based on any medium, there is a third system, which is based on
common knowledge and usually taught to children in grade school. The "popular system" is based on
the three primary colors RED, YELLOW and BLUE and has proven to have a deep, ingrained
psychological effect on people, and therefore is the system more commonly used by artists when
choosing colors that will affect the audience.

Secondary colors
The first rule of color theory stated that the primary colors are responsible for forming all the other
colors of the rainbow. Most color theories also agree that if two primary colors are mixed together, they
will form a secondary color. So, in summary, these are the basic primary and secondary colors for the
three systems:

Tertiary colors and the Color Wheel


When a primary color is mixed with a secondary
color, a tertiary color is formed. When displayed
in a circular fashion, it forms what is called a color
wheel. Each color can be then mixed to its
neighbor to form other hues.
The color wheel is one of the most important tools
an artist can use to make up color schemes. CS
has a powerful interactive color wheel, that can be
manipulated in a very intuitive way.
The example shown here displays the popular
system's color wheel. This is obviously a very
simplified version, showing only colors in the
purest hue, that is, in their purest state.

Complementary and Analogous Colors


Two other color theory concepts are also important to know before approaching CS:
1) Complementary colors: are those that are directly opposite to each other on the color wheel.
These colors in theory nullify each other, that is, they irritate our eyes in a way that we strive for a
medium grey.
2) Analogous colors: are those colors that are close to each other on the color wheel. They are
similar and therefore form a more or less neutral combination, without irritating our eyes.

Color Schemes: The Program


CS was designed to help you see how colors interact with each other independently of the theme,
shape or form of your project. It displays colors in their purest form. CS was created for artists and
designers, in an attempt to ease the process of choosing the best color scheme for each project.

CS Interface
The main windows of CS are divided into the following areas (see figure on next page):
1) Color scheme display window: displays the color scheme you are working with. In this window,
you can clearly see how one color affects the other. The window shows colors in three different
patterns, helping you to visualize how each color can affect it's neighbor. This window can also show
multiple color schemes.
2) Color Wheel window: displays a sophisticated color wheel, with almost all the different colors
available.
3) Current color display: displays one single color and allows real-time adjustment through controls.
4) Interface tabs: change the color wheel display into other controls that allow fine-tuning of single
colors.
5) Color tabs: displays all the colors of the current scheme, showing the current one being work on
above the others.
6) Pull-down menus: traditional pull down menus have controls the allow saving files and editing.

1. Color
scheme display
window
2. Color Wheel
window
3. Current color
display
4. Interface tabs
5. Color tabs
6. Pull-down
menus.

How to create color schemes: different methods


CS offers many ways to manipulate and create colors schemes. You will find that your own personal
methodology will guide you after you've acquired experience with the software. As a starting point, we
offer the following methods:

First method:
Choose quantity and
Randomize Colors
When you first initiate CS, the
color scheme window will pick a
random color scheme that can
have any number of colors
between 1 and 5. You can
choose then adjust the number
of colors you want by adjusting
the Total colors amount and
clicking on the Randomize
button to make the software
choose for you. You can also
randomize individual colors.

Second method:
Choose quantity and pick
individual colors from the Color
Wheel
If you want to have a little bit more of control
over the color scheme, you can pick each
color individually on the color wheel.
Depending on the number of colors you
determine in the Total Colors, CS will
display a different shape (also called
geometric overlay) on the color wheel: a
straight line for 2 colors, a triangle for 3
colors and so on. Each vertex corresponds
to the position of the individual color on the
scheme. By clicking and dragging on the
vertex of the shape on the color wheel, you
can adjust individual colors. If you drag
them towards the center, they will become
lighter; towards the perimeter, they will
become darker.

An important comment about the color


wheel: the wheel itself is not capable of
displaying 16 million colors, for it shows only
hues added with white (making them lighter) or
hues added with black (making them darker).
The amount of grey (saturation) is controlled with
the slider bar underneath the wheel. If you drag
the slider, it is possible to create unsaturated
colors, however, you may create a color that
cannot be displayed on the wheel. If that should
happen, CS will then display the vertex outside
of the wheel marked in red, and will show the
button FN (find nearest). If you click on FN, the
nearest match will then be located.
The color wheel offers many creative
possibilities, see further on for a more detailed
description of it's side bar.

Third Method: Create individual


colors using the sliders
If you prefer a more logical approach to
choosing colors, CS offers a range of
traditional sliders with which you can fine
tune colors. Under the tab Sliders you will
find three sets of sliders:
First slider Hue, Saturation and Value:
the hue slider controls the color at its
maximum brilliance and saturation. The
Saturation controls the amount of gray, or
"dirtiness", and the Value controls the
amount of white or black (brightness).
Second slider RGB: by varying the
amounts of red, green and blue, you can
obtain colors using the additive system.
Third slider CMYK: by varying the Cyan,
Magenta, Yellow and Black, you can obtain
colors using the subtractive system.

The easiest way to create a color using


sliders is to use the HSV set of sliders:
1) Choose the main hue (in the figure we
are using purple as the main hue), then
drag both the Saturation and Value sliders
all the way up to 100%.
2) Fine tune the colors: if you want the
color to have less strength, to be dirtier,
then drag the Saturation slider down;
3) If you want to control the darkness,
then drag the Value slider down.
The figures show the same color purple
being manipulated with the HSV
Saturation and Value sliders.
Note: The C buttons allow you to copy
values to a text file, and the HTML
button converts colors to html format for
web sites.

Fourth method:
pick individual
colors by name
CS also offers the
alternative of choosing
colors by name, although
this is quite a bit
subjective.
By clicking on the tab
Names you will be
presented with a list of
common names given to
colors and a few
alternatives per name.
You can then click and
drag the color chosen to
the current color display
or the color scheme
window.

Fifth method: Use the formulas to come up with new ideas


CS offers a powerful tool that helps you stimulate your creativity: the formula wizard. By using
traditional Color Theory concepts, CS can come up with suggestions for color schemes. To call the
Formula dialog box, simply click on Formulas at the bottom of the color scheme window.

A new window, similar to the main interface, will appear over CS. Notice that
CS uses the current color to make its first calculations.
It is recommended that the first thing you do is hide the main window by clicking on the button
Hide/Show Main Window, so the colors in the background will not conflict visually with the formulas
window (See figure on next page).

Formulas
Since color is such a subjective theme, please keep in mind that the solutions offered by the Formula
Wizard will not always fall into a specific category, and the comments made here are largely
generalized.
The wizard can work based on the
current color or independently. When
working with the current color, the color
will be displayed in the current color
window. When using a formula that does
not use the current color, the wizard will
display a checker board pattern in the
display area. See figure
There are four main action buttons in the
formula wizard:
Add and Update: Will either add a
new scheme or replace the current
one in the main interface window.
Re-Calc: will recalculate a new
version for the current formula tab.
Re-Calc All: will recalculate new
versions for all the formula tabs.

Click on one of the tabs to be


presented with one of the
following formulas:
Monochromatic: By using the
current color as a starting point,
CS offers a color scheme with
monochromatic colors, that is,
the same hue with different
values (brightness). This kind
of color scheme is usually dull
but not irritating.
The figure shows an example
of an almost monochromatic
scene, using brown as main
color, and a few isolated
accents of other hues.
Image by Eni Oken, Copyrights
1996 2Way Media.

Analogous: CS offers a color scheme by choosing colors that are neighbors to the current color on the
color wheel, with different values. This type of color scheme is usually appropriate for more
conservative audiences.
Primaries/Secondaries: CS disregards the current color and offers a color scheme based solely on
primary and secondary hues, with different values. These colors are usually vibrant, and this kind of
color scheme usually appeals to younger audiences such as children and teens.
Tertiary: CS disregards the current color and offers a color scheme based only on tertiary colors. This
type of color scheme is also vibrant, but they do not have the primary appeal as the Primary/Secondary
ones have. This type of color scheme is suitable for more alternative audiences, capable of accepting
strange combinations.
Pastels: CS disregards the current color and offers a combination of colors that are located next to
white. This type of color scheme is usually very feminine and soft, but can also be used for children's
themes and poetic fairytales.
Warm: CS disregards the current color and offers only colors that are considered WARM (yellow,
orange, red, magenta) in different values. This type of color scheme is usually cheerful and vibrant, but
can be tiresome after a long period of time.

Cool: CS disregards the


current color and offers only
colors that are considered
COOL (magenta, purple, blue,
teal, green), in different values.
This type of color scheme is
considered soothing and does
not irritate the eyes so much,
but can be boring after a while.
The figure shows an example
of an image using only cool
colors: purple, blue and green.
Image by Eni Oken,
Copyrights 1996 L-Squared.

Complementary: CS
offers a color scheme
made of the current color
plus a direct
complementary (a color
that is directly opposite to
it on the color wheel).
These colors usually clash
with each other, irritating
the eyes, therefore this
type of color scheme is
usually more suitable for
more audacious projects.
The figure uses blue and
orange, which are
complementary colors
Image by Eni Oken,
Copyrights 1997 Alfred
Publishing

Discord: CS offers color schemes composed of colors that clash with


the current color. These combinations are usually vibrant and
energetic, but can tire the eyes quickly.
Neutral: CS offers combinations made of colors that do not clash
with the current color, and are visually soothing. These colors tend to
be a little boring after a while.
Split-Complementary: CS offers a color scheme using neighboring
colors of the current color. This type of color scheme is usually a little
softer than the straight complementary combinations but are still
audacious.
3-way-split: CS splits the color wheel in three parts, based on the
current color. This type of color scheme is usually cheerful and fun to
use, although it should be used for more accepting audiences.

4-way-split: CS splits the


color wheel into four
equally distant parts
based on the current
color, and varies the
values. This type of color
scheme is difficult to use
but produces intense,
vibrant results.
The figure shows an
image with a complex
color scheme originally
based on the 4-way split
plus one extra color,
orange. See the color
scheme on the next page.
Image by Eni Oken,
Copyrights 1999 Eni
Oken.

This figure shows


the color scheme
for the image of the
previous page.
Notice how the
four colors red,
yellow, blue and
magenta form a
rectangle. The
added orange
breaks the perfect
quadrilateral.

Typical workflow with CS


A typical workflow with CS would consist of:
1) Create a color scheme using one of the methods
described before.
2) In the color scheme window, double-click to change to
multiple color scheme mode. See figure.
This allows you to see several color schemes at the same
time.
3) Right click to show the mouse menu (or choose Edit/Add
Scheme) to add a new scheme. It will be a copy of the first
scheme created.
4) Click on the new scheme to make it active.
5) Double click anywhere in the window to work in single
colors scheme mode.

6) Manipulate and fine tune one or more colors of the new scheme. Click on the color tabs to make a
chosen color current and use the color wheel, sliders, randomize or color names to fine tune it.
7) Create another color schemes using the formula
wizard. Add the new scheme to the multiple window
display.
8) Interchange colors between the color schemes by
dragging colors from one scheme to another. Use the
CTRL or SHIFT to swap or replace (see the roll-over
help: position the cursor anywhere in the main
display window and a help window will appear).
9) Test the colors in the TEXT tab to see how they
would appear in a graphics arts project or web site.
See figure
10) Name the individual color schemes if you like,
using the Rename schemes button (or use
Edit/Rename Scheme). Save your work by using
File/Save.

Stimulating your creativity


The methods described before are just a way to start using CS to create color schemes. The true
power of CS lays in it's ability to create unexpected color schemes to jump start your creativity. You
already saw the power of the formula wizard, and also the Randomize buttons.

The Color Wheel Side bar


If you are lacking ideas, you can also play with the
color wheel's side bar, manipulating the shapes, and
at the same time, creating surprising results.
1) Create any color scheme, with at least 3 colors.
2) Be sure that the Show geometric overlay check
box is checked. This will show the geometric shape
over the color wheel.
3) Be sure that none of your colors is falling off the
color wheel (A button FN will appear in the lower left
hand corner of the wheel, which will allow you to find
the nearest match inside the wheel).
4) Use the Move button and arrows to move the
shape over the wheel. Notice how it shifts colors.

5) Use the Rotate button and arrows to rotate the shape, creating unexpected results.
6) Use the Scale button with the plus and minus size to change the darkness of the colors (minus will
make the shape smaller, thus making the colors whiter; plus will make the shape larger, making the
colors darker.

The Variable color tab


Another way to vary a color scheme in CS is by using the Variables color tab: it's the last tab under the
lateral color tabs (See figure).
This tab offers a menu that allows to vary the
colors of the current color scheme:
Contrast: will adjust the contrast between
colors.
Brightness: will adjust the relative brightness
of all colors.
Saturation: will adjust the saturation of all
colors.
Hue: will change the hue of the colors, based
on the Amount slider underneath.
If you make changes and like the results, you
can make those changes permanent by
clicking on Make Changes Permanent.

Credits
This document was written by Eni Oken. All rights reserved.
CS was designed and developed by Eni Oken and Gregg Patton.
CS was programmed by Gregg Patton.
Copyrights 1999 Can You Imagine Software, Inc. All rights reserved.
Eni Oken is a freelance 3D artist based in Los Angeles. As an architect with 11 years of experience in
computer graphics, she has participated in the creation of 3D art for numerous interactive projects
such as games, web sites, multimedia and virtual worlds. She has also won several awards for her
work and is the author of 3 books and several magazine articles covering topics related to creating
computer graphics art. You can reach Eni at: www.oken3d.com
Gregg Patton is a software engineer with over 11 years of professional experience in software
development. Gregg has developed several computer graphics applications and plug-ins over the
years. Some of these applications include Tree Factory, Tree Factory - MAX, and DigiPeople.
Gregg lives in Fort Worth, Texas and can be reached at gregg@canyouimagine.com
Web site: www.canyouimagine.com/prod_cs.htm
Tech support: support@canyouimagine.com
Comments: colorscheme@canyouimagine.com

You might also like