Website Design Blog. Evoart

To some extent I think so, yes. There’s plenty of us out there who really struggle when it comes to selecting the colour palette for our next website concept, or logo design. With practice it gets a little easier, but even so it can be a real struggle for even the most experienced of us. After all a splash of red here, and a hint of black there can connote so many things and conjure up different feelings for different people, so its no wonder the world of colour can be so daunting!

In this article I’m going to attempt to offer some help when it comes to you staring at a blank canvas in Photoshop/Illustrator, wondering what colour to add next, and share with you some tips on how I go about choosing colours for my designs. I’m no expert, but I hope you may find these insights and this article in general helpful.

Expose yourself to colours around you

This is really important as you can’t expect to be inspired if you don’t let yourself soak up the colours you see around you everyday.

When I say this, I don’t mean the grey from the pavement you walk to work on every morning, I mean design and life in general. Take a look at this fantastic photograph below (taken by nerboo on Flickr). Look at all the vibrant, fresh colours. Surely that inspires you?

You could even try walking into your local newsagent, picking up a copy of any magazine and you’ll be greeted with sources of colour inspiration. The same goes for watching television — most adverts these days are very creative and you can be sure to draw inspiration from these. Look out for colours that compliment each other. The more often you do this the easier it becomes and you’ll notice yourself picking up on more of the designs around you.

Complementary Shades - No more than 4 colours

When choosing colours, look for colours that complement each other. Often these can be slightly darker, or lighter shades of the same colour.

In my experience, designs that work best tend to have only 3 or 4 colours that make up their entire colour palette. I think sometimes designers use too few colours, and consequently run the risk of their designs looking boring and flat. Others try to over do it with 5 or 6 colours, making the design way too busy and distracting.

Heres an example of a lovely colour palette (all be it quite dark), consisting of 4 colours. The red and black dominate this palette with the two greys complementing them both perfectly. Try to bear this in mind when selecting your own colours as you don’t want to have them all fighting for attention.

Make your colours serve a purpose

Often it can be a good idea to use one particular colour from your overall palette for all the ‘Calls to Action’ on your site, and another for, lets say, the products. This type of consistency can really work well and will subconsciously help the users on your site recognize and distinguish between different areas and functions on your site.

So they have a logo already

The starting point for most web designers when it comes to a concept is the logo. If you’ve got a great logo to work with it can be brilliant and really get your imagination flowing, but equally painful if you’re working with something that looks like its just leap out of the 80’s! I’m sure you can relate.

I always tend to select my main colours from the company’s logo. After all its the main representation of their brand and needs to be carried right across all their marketing material. At the start of a project try to request all the companies printed material if you can, so you can get a good feel for their style, and also the colours they use.

How I chose the colour palette for Authentic Style

I thought using a case study might be a good idea, so using my portfolio somehow sprang to mind!

The colour palette Authentic Style uses is essentially pretty simple, and consists of brown, orange, black and a lighter, muted shade of white brown.

Brown was always going to be the dominant colour. I chose it as its unusual (although more and more brown websites are cropping up) and not a colour I had worked with much previously. I guess it usual strikes up quite negative connotations, but coupled with a vibrant orange  really works well I think.

If the orange had been left out I believe the design wouldn’t look half as good, just because the orange gives it that little injection of colour and really stands out against the brown background.

Finally I used black to help frame particular elements on the page. For example the featured work and work thumbnails, and also the links to view my work in the lightbox.

What techniques do you use?

If you’ve got any special techniques you use to select the colours for your designs please let us know in the comments below. It’s always interesting to find out how other designers work.

Helpful Colour Tools…

Here are a few of the tools I find most useful;

ColourZilla Firefox Add-On - Lets you use an eyedropper/colour picker tool in Firefox to grab colours on the fly.
ColourLovers - A fantastic site featuring fabulous colour schemes, and now even patterns to download.
ColourLovers Blog - A great blog about colour, and colour inspiration.
Colour Schemer Gallery - Another great colour scheme gallery for you to check out and be inspired by.