Amazing Colour Effect using Trichromacy
Displayed above is an amazing trichromacy colour effect that all designers should see. If you take a look at the X’s, they both look as though they are different colours. However, they’re not. The colours are exactly the same tone:
Look at where both the X’s intersect at the middle-base of the image. You can see there that the ‘true colour’ is in fact a greyish-yellow tone (a mixture of the two colours used in the rectangles). This effect is based on a painting by Josef Albers.
To see something a little weirder, take a look at the second image I have devised, taking the effect one step further:
As can be seen, the horizontal bar appears to show a gradient, starting with yellow on the left, to grey on the right. However, as with the first image, the colour is a solid tone—not a gradient of two colours at all. If you don’t believe me, drag the images into PhotoShop® and whip out the colour-picker tool!
Why is this happening?
This effect is know as trichromacy, with the images above demonstrating simultaneous contrast. To cut a long story short, out eyes record colour in RGB—but none of us can image a yellowish-blue. Our brains therefore plays tricks on us, resulting in the effect/illusion.
I think knowing this kind of information about colour can be extremely beneficial to a designer. Colour theory is embedded in all we do, so it’s great to understand great effects like this to aid in design work. Knowing what colours will or will not work together can be imperative—especially in logo design.
I have written an article about metamerism with another colour-illusion there if this subject interests you. Do you know of any other great effect like this? Do you think knowledge of colour theory will aid in your design work?
If you liked this post, check out A Print Handbook for Designers.
Why not take a look at one of these Articles...
About the Author
21 Comments
That is pretty amazing and definitely worth knowing…. now to find an excuse to use it!
01 May 2009 05:05 pm Matt Simpson
I’ve got another color contrast effect for next week, too.Thanks for commenting Matt.
01 May 2009 07:05 pm Andrew Kelsall
Amazing color effect that all designer’s should see……
Displayed in this article is an amazing color effect that all designer’s should see. If you take a look at the X’s, they both look as though they are different colors. However, they’re not. The colors are exactly the same tone……
thanks. this was a wonderful discovery. i am glad now i know this!
02 May 2009 10:05 am swapnet
Hi Andrew,
Thanks for this topic…you brought me back to college. In color theory class, we used “coloraid” (link below) paper to show this very effect and others.
Another one is to use colors and shapes, side by side and on top of each other to show depth perception and movement. This was one of my favorite classes.
http://www.coloraid.com/index.aspx
I enjoyed my first visit to your blog and definitely will be returning.
Pam
02 May 2009 03:05 pm Pamela
heh cool. learn something new everyday
CAMSs last blog post..Redesign Soon
03 May 2009 12:05 pm CAMS
Hi Andrew. Great. I thought I knew all these optical illusions already. I obviously don’t. Can’t wait for an excuse to use this!
03 May 2009 02:05 pm Rob Cubbon
@ CAMS
Thanks for commenting…
@swapnet
No worries
@Pamela
Glad you liked it. It was interesting to learn from your link, that Color-aid was discovered by Josef Albers. Thanks for commenting.
@Rob
I’ve been thinking of where I could put this to use, too. Great minds think alike
03 May 2009 03:05 pm Andrew Kelsall
Andrew & Rob,
If you think about…you put it to use every time you design. Color theory is part of all that is creative. It’s always in the back of a designer’s mind when choosing colors…sort of subliminal if the designer really knows the theory behind color and what it can do.
Colors are not static unless used by themselves, but when they are paired it’s sort of like a chemical reaction. As Andrew illustrated above.
Pam
03 May 2009 03:05 pm Pamela
Amazing how the brain works, huh?
I’ve noticed that people don’t consider how they use color in a lot of design pieces lately. They should. It can have a huge impact on people.
brians last blog post..10 Terrific and Handy CSS Resources
03 May 2009 03:05 pm brian
@Pamela
I totally agree. On the majority of occasions, a color can only be judged on suitability, for example, when placed side by side with either one color or range.
@Brian
Yeah, we’re not designing for dogs
I find color theory a really useful and interesting area to research into. Nobody knows it all, that’s why I love to learn the areas I don’t know and pass it on anyone who’s interested.
Any designer who doesn’t have at least a basic understanding on color theory isn’t doing themselves justice in the profession at all. Like you said—they should.
Thanks for your input.
03 May 2009 06:05 pm Andrew Kelsall
This is totally natural.. nothing amazing about this!
04 May 2009 07:05 pm kindergarden
@ “kindergarden”
That’s quite negative. I know too well of the inner working of the eye and how we perceive color. Of coarse it’s natural, but to designers who love color theory, many would consider it quite amazing—and it’s good to discuss such things.
The milk in my coffee is natural, but the process of how cows make it still amazes me.
04 May 2009 07:05 pm Andrew Kelsall
Thanks. Seen this stuff before, pretty interesting.
Brads last blog post..Everyone’s tweeting but no one’s listening
11 May 2009 11:05 am Brad
@Brad
I’ll eventually get the other color illusion sorted out at some point. Thanks for commenting…
11 May 2009 02:05 pm Andrew Kelsall
[...] this month, I wrote an article about simultaneous contrast entitled Amazing color effect that all designers should see. This new “illusion” is based on the principle of successive contrast, whereby the [...]
Hmm… it’s either my eyes, or my monitor… because the X’s both look the same, and I don’t see any gradient on the bar.
no funky visual effect for me
27 Jun 2009 11:06 pm pearible
Hi @Andrew Kelsall this color effect looks great, thanks for the idea.
28 Jun 2009 06:06 am Mahallo Media
@pearible → This illusion works best in print. Also, not all people see color the same. Everyone else appears to see the illusion working well. Maybe your monitor isn’t displaying colors accurately?
@Mahallo Media → Hi! Thanks for commenting and visiting my blog
28 Jun 2009 01:06 pm Andrew Kelsall
[...] I found a copy of their illustration here. (It’s the one with two X’s, rather than the one with a single bar.) [...]
WOW thats great!
Now this is something every designer should at least implement once in their designs
23 Apr 2010 11:04 am Murtaza Imran