EN ES  BR 

BaseKit Learning Centre

Web design & online marketing articles, tutorials, videos, slideshows and more!

5 Colour Tips for Website Design

By Alex Woods on May 16, 2011

Tip 1: Limit your colour choices

The fewer the better. Creating a harmonious colour scheme is essential and will tie your website elements together, making your page design well balanced. 


Colour can grab the eye so using splashes of bright hues from your palette can highlight and emphasise certain information. 


You can also achieve depth by layering colours from light block tints to heavier shades creating information hierarchies with in your website design.

Tip 2: Contrast is Key

Colour contrast appears more intensely on screen than in printed matter so utilising it correctly is essential for visual success. Complementary colours, those which are opposite on the colour wheel, can work well together as they intensify each other when placed side by side. For typography however a different kind of contrast is required for optimum legibility, the most important factor for creating a website. Using pure hues can be too harsh on the eye, especially at smaller point sizes, so these should be kept for bigger titles to add distinction whereas neutral tones saved for the body type.


Tip 3: Branding

Make sure you consider brand guidelines and devise a colour scheme to enhance the company colours. Tints, shades and tones of the main hues can create versatile and exciting colour palettes.

Tip 4: Going global?

Where do your existing and prospective customers live? Which market are you targeting? There are plenty of cultural considerations to factor in when choosing colours due to the symbolism of varying colours throughout different parts of the world. For example in the East white symbolises mourning whereas in the West white is for weddings and purity.

 

Tip 5: Consider colour psychology

Visitors to your website make subconscious opinions of your brand the moment they land on the homepage. The colours used are the first thing they see which triggers their subconscious response to that particular colour scheme. Colours are psychological and all have inherent associations. Green is for the environment. Pink is feminine. Blue is for corporate and calming. Here are more examples of websites and their commonly perceived colour connotations:

 

Blue

Success, serious, calmness, power

colour tips for website design

Purple

Royalty, luxury, fantasy

purple website

Yellow

Curiosity, playfulness, amusement

yellow website

Green

Nature & life, calming, safe

green website

Creating Your Own Colour Palettes

 

There are numerous tools to help you create that perfect colour scheme. Here are a couple of our favourites.

 

Kuler

Browse through user created palettes or make your own using the colour wheel application or from your own photographs.

creating your own colour palettes

Colour Lovers

A vast library of user created colour palettes and trends. A great place to get inspired.

color lovers
Image description

Leave a Comment

blog comments powered by Disqus

Learning Centre Newsletter

Image description

Stay up to date with our weekly email

digest of how-tos, guides and advice!