Design 101: Colour

In the first of my series on the basics of good web design I tackled how to handle branding. In this article I want to deal with the more subjective issue of colour. How do you choose the right colour palette?


A subjective decision

The biggest problem with choosing the right colour palette is that it is all down to individual taste. Colour is a matter of opinion and there is no right or wrong answer. As a result you will get as many opinions on your colour palette as people you ask.

Differences in colour

Part of the problem is that we all perceive colour in slightly different ways. Also roughly 1 in 20 people have some form of colour vision deficiency.

However that is just the beginning. In addition to the differences that exist between people in the way we perceive colour, there is also differences in the way our computers show colour.

There are a whole range of factors which affect the way our computers display colour. These include:

  • Monitor type
  • Monitor brightness and contrast settings
  • Graphics card used
  • Operating system being used
  • Colour depth
  • Gamma settings

Colour theory

Because the choice of colour is so subjective and because you cannot guarantee exactly how a colour is going to be finally displayed to the end user it is important to remove the choice of palette from the realms of personal opinion. One way to do this is to use colour theory.

A lot of research has been done in how users respond to colour and what emotional connections they make. We all know the basics like red means danger or blue is cold. However this area of research has gone much further.

An excellent book on the subject is Shigenobu Kobayashi’s book Color Image Scale. This book provides over 1000 colour palettes organised by mood, taste and lifestyle. What this book allows you to do is look up a concept such as "Urban" and find an appropriate colour palette.

I know that many people are skeptical of books like this but I believe they have real value. Kobayashi’s book was based on research done over 3 years involving analysing responses to colour from a large sample audience. Surely this is preferable to a few individuals debating the subject based on personal preference.

Corporate colours

Of course in many situations you don’t have the luxury of starting with a blank palette. Often you will be required to work with an existing corporate colour such as IBM blue. In these cases it is a matter of finding complimentary colours that work well with your corporate colour.

Again, in order to avoid descending into the world of personal opinion, I prefer to use colour theory as a base on which to build.

Fortunately there are some excellent tools out there that will help you build a palette based on a single corporate colour.

Some sites worth experimenting with are:

Color Match 5KColor scheme generator 2

However by far my favourite is a piece of software called Color Schemer Studio. This brilliant tool allows you to create a variety of colour palettes based on long standing colour theory principles. It also exports them in a variety of formats and provides RGB and HEX values. It even helps you ensure high contrast for the best web site readability.

Conclusions

This article just scratches the surface of an enormous subject but hopefully it provides a few useful tips to get you started on creating effective colour palettes while avoiding the squabbles of personal preference. In my next article in the Design 101 series we will look at structure and layout.

  • http://adventurousiam.blogspot.com zakirah

    this article really helps me in my study. thanks a bunch.
    -graphic student-

  • Terry S.

    I happened to stumble upon your site doing some searches for color theory and I must say, I am hooked. I really enjoyed reading this article and will be subscribing to your feed. I look forward to reading more.

  • http://www.pinpointstudios.ie Se├ín

    Have a look at Adobe Kuler (http://kuler.adobe.com)

Headscape

Boagworld