Amazing Colour Effect using Trichromacy

simultaneous contrast

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:

trichromacy

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.

Share on Facebook3Share on Google+3Tweet about this on TwitterShare on LinkedIn12Share on StumbleUpon39Pin on Pinterest6Email this to someone

Why not take a look at one of these Articles...

21 thoughts on “Amazing Colour Effect using Trichromacy”

  1. Matt Simpson
     · 

    That is pretty amazing and definitely worth knowing…. now to find an excuse to use it!

  2. Andrew Kelsall
     · 

    I’ve got another color contrast effect for next week, too.Thanks for commenting Matt.

  3. swapnet
     · 

    thanks. this was a wonderful discovery. i am glad now i know this!

  4. Pamela
     · 

    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

  5. CAMS
     · 

    heh cool. learn something new everyday 🙂

    CAMSs last blog post..Redesign Soon

  6. Rob Cubbon
     · 

    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!

  7. Andrew Kelsall
     · 

    @ 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 😉

  8. Pamela
     · 

    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

  9. brian
     · 

    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

  10. Andrew Kelsall
     · 

    @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.

  11. kindergarden
     · 

    This is totally natural.. nothing amazing about this!

  12. Andrew Kelsall
     · 

    @ “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.

  13. Andrew Kelsall
     · 

    @Brad

    I’ll eventually get the other color illusion sorted out at some point. Thanks for commenting…

  14. pearible
     · 

    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 🙁

  15. Mahallo Media
     · 

    Hi @Andrew Kelsall this color effect looks great, thanks for the idea.

  16. Andrew Kelsall
     · 

    @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 🙂

  17. Murtaza Imran
     · 

    WOW thats great!

    Now this is something every designer should at least implement once in their designs 😉

MT VPS SERVER AD BANNER