[thelist] The use of color (was site header and logo)
Heather Quinn
info at windyhilldesign.com
Fri Jan 4 18:54:16 CST 2002
Hi, Alliax.
There's absolutely nothing wrong with your reasoning. Liquisoft is
talking about a different color system than is used on the web.
First, use the word complementary, not complimentary. The c word with
the e means *opposite*. The c word with the i means *in harmony with*.
(Liquisoft is using the wrong word.) You are searching for
complements, or opposite colors, which are, as you've found, the inverse
of the original colors.
Liquisoft's color wheel, and their entire discussion of color, comes
from the world of pigments, in which the opposite of blue is orange.
But you are working with web color, which is light-based, and has
different primary and secondary colors, compared to pigment-based colors.
The pigment-based color system is a way of organizing how colors in
pigments work. with each other. Pigment absorbs certain parts of the
light that hits it. The parts not absorbed by the pigment are reflected
back to your eye, and that creates the color you see. The pigment
primaries are red, yellow, blue. The pigment secondaries, which are the
complements of the primaries, are green (complement of red), purple
(complement of yellow) and orange (complement of blue).
Web stuff works with the world of light. A monitor creates light of a
particular color by shooting an electron beam at a pinpoint of dye
containing a substance that will flouresce, or give off light, when hit
by electrons. The pinpoint of dye is on the inner surface of the
monitor screen. The "excited" dye pinpoint flouresces at a certain
wavelength. You see this wavelength directly as radiated color. There
is nothing subtracted or reflected. The light-based color system is a
way of organizing how colors of light work with each other. In
light-based color, the primaries are red, blue and green. The
secondaries, which are the complements of the primaries, are cyan (a
brilliant blue-green that's the complement of red), yellow (complement
of blue), and magenta (a brilliant purple/pink color that's the
complement of green).
In each color system, if you mix two adjacent primaries, you will get
the correct secondary, which is the complement of the third primary (the
one not involved in the mix). The differing color systems are based on
physics, on the way materials (pigments) and light actually behave: They
are not arbitrary systems.
(And to make things even more confused, the light-based colors'
secondaries become the primary colors of the CMYK -- cyan / magenta /
yellow / black -- system used for printing, with inks, color channels &
separations, etc.)
I still haven't worked out a deep knowledge of this stuff in detail.
But I do know that the fact that color we see on the web is light-based
is the reason that print and pigment based colors schemes always need to
be adjusted before they work on the web, and vice-versa.
I wrote the following to someone else who was comparing the pigment and
light based complements to blue, and thinking about which one "worked"
best (the classic test as to whether a complement is "right" is if it
"vibrates" when placed next to the color it's supposed to be
complementing) :
"They do, but only in their natural settings. The blue/yellow set really
vibrates, because it's a complement pair from light, and you're
displaying it in a light medium (monitor, on the web). But the
blue/orange set doesn't vibrate, because it's out of its medium. It
would vibrate in its own natural setting of paint, ink or other
pigmented media.
"Why is this important to clarify? Because it explains why print artists
have trouble transitioning to web — they are used to seeing how colors
work with each other in pigment or ink media. They will often do neutral
or high-key (pale) color palettes as a temporary "crutch" for a couple
of years, until the nature of web color sinks in. And, conversely, it
explains why those of us who started designing on the web cannot always
produce effective printed pieces! The colors simply don't work the same
way with each other! The web designer's "crutch" when first doing print
work is to stay with harmonious color schemes on white or pale
backgrounds for a few years, until the nature of print-based color sinks
in ;-)."
IMHO it's important to learn how color really works for yourself. You
would start, as you are doing, with math-based formulae using the light
color system values. But things aren't as simple as determining
complements at 180 degrees, or calculating which colors are 60 or 120
degrees from your starting color, etc. Math-based rules can only take
you so far. Humans react viscerally to color. And a color that does
not work in setting A can be made to work spectacularly in setting B.
Advanced color work would mean confronting human and cultural reactions
to color, doing one's own color experiments, and developing an
internalized and instinctive understanding of color in this medium that
will make your work stand out.
Alliax wrote:
>------current message--------------
>
>Much to my distress, when actually working on it, I realised that inverse color and complimentary color is the same (as for Photoshop)
>
>for example I take Blue
>RGB is 0 0 255
>HSB is 240° 100% 100%
>
>I do a reverse, it's yellow
>RGB is 255 255 0
>HSB is 60° 100% 100%
>
>note that the H roation is 180°
>
>Well, this would means that the complimentary color of Blue is Yellow ?
>but by reading this page and using their color circle
>If I take the blue, and I do a 180° rotation, I fall on a ORANGE color..
>http://www.liquisoft.com/color.html
>
>Well, I am stuck I don't understand exactly how they manage to do this color circle, obviously it's not a RGB -> HSB otherwise I should obtain the same values, no?
>
>If someone understand what's wrong in my reasoning, it would help me going on..
>
--
Cheers,
Heather Quinn
info at windyhilldesign.com
http://www.windyhilldesign.com
More information about the thelist
mailing list