Using Color in Web Design


Your logo and site are more than just a collection of text, images
and white space. Somewhere in there are the colours you choose. It may
seem trivial, but the colours you select to represent your company will
influence your audiences’ perception of you and will determine if they
stick around to investigate further. How much time would you spend on a
site that’s background came up in bright yellow? You probably wouldn’t
even wait for the images to load. Why? Because while, in small doses,
the colour yellow can denote a spiritual feeling, it is the harshest
colour on the eyes, and is likely to send you running for cover.

People use colour to categorise objects in their everyday lives. Green
means go. A yellow bus is a school bus. A light blue box is a Tiffany’s
box. Therefore, it’s only logical that your customers are using your
colours to gather important information about your company. Similarly,
many companies use colour in their web design to help users identify and
categorise their brand with just one glance. In fact, for some
companies, the colour in their logo is the basis for their entire
branding strategy (think IBM Blue). Use it wisely.

The Hidden Meaning Behind Colours

You know what colours you like, but do you know what your favourite
colours mean? You may want to brush up on the hidden meaning behind
colours before designing your company material.

  • Blue — Blue is currently the most popular colour for
    companies to use in their branding strategies. It represents calmness,
    hope and stability. Research says that people are apt to immediately
    trust information coming from sites that are blue and to pay attention
    to blue logos.
  • Red — Numerous studies have claimed that people
    working in red rooms work faster. Why? Because the colour red is said to
    increase blood pressure and heart rate. That might be perfect if you’re
    trying to work your employees to death, but if you’re trying to attract
    customers, moderate your use of this powerful colour.
  • Yellow — Used in small amounts, yellow is inviting,
    sunshine, cheerful and the number one attention getter. However, it has
    conflicting symbolism. To some it denotes happiness and joy, and to
    others it symbolises cowardice and deceit. Research what this colour
    means to your target audience before plastering it all over your site.
  • Green — In the United States, green means go. It is
    associated with movement, nature and fertility. It symbolises growth,
    freshness and safety. Darker shades of green are often associated with
    money and wealth. It is the most restful colour for the human eye.
  • Orange — As many ‘on sale’ products have orange
    stickers attached to them, people have come to associate this colour with
    affordability. Bright orange is hard for the eyes to process and is not
    recommended as a background colour for your site, though it can be very
    effective for logos. Small amounts of orange can help create a ‘fun’
    atmosphere, so use it sparingly.
  • Purple — Purple is associated with royalty. It
    symbolises luxury, power, wisdom and ambition. Lighter shades of this
    colour are said to evoke romantic and nostalgic feelings.
  • Black — Considered the negation of colour, black is
    conservative. It can be serious and conventional or mysterious and
    sophisticated. The colour black usually has a negative connotation
    (black humour, blacklist, etc.).
  • White — The colour white is associated with
    innocence, purity and goodness. From a marketing perspective, white
    often denotes cleanliness, dairy or low-fat.

Selecting Colours for your Web Site Design

When designing your site, we recommend finding a colour palette that
you feel works and then sticking with it. Don’t try and mix colours from
different colour palettes because it’s likely the colours will not blend
as well as you’re imagining. This may cause your logo or site to look
disjointed. For a palette to work well in a web site design there should
be some type of unifying attribute. What ties your colours together?

Keep in mind that the human eye requires contrasts to be able to read
something clearly. Don’t pick web design colours that will be hard to
read when placed together. For example, dark text on a dark background
probably will not work. Try opting for a light background and dark text,
or a dark background and light text. The difference in tones will
visually interest your consumer’s mind and make them want to focus in to
read your text.

Bringing Back the Colour Wheel

Remember in elementary school when your teacher broke out the colour
circles and told you all about the different degrees of colour? She was
on to something.

What does the colour wheel have to do with your web site branding
strategy? Every colour is suited for a specific purpose; it’s your job to
make sure the colours you pick match the goals of your company.

Be careful when trying to combine colours from different colour
spectrums – it could confuse the user or make your logo and/or site
appear too ‘busy’ or cluttered. We recommend combining colours from the
same level of the colour wheel.

  • Warm Colours — Warm colours are made with reds,
    pinks, oranges, yellows, golds, browns or some combination thereof.
    Generally, warm colours tend to be more exciting and aggressive. They can
    connote feelings from simple optimism to strong violence, and as a
    result many people prefer them in small doses. Designers can ‘tone
    down’ warm colours by using the lighter side of the warm colour spectrum,
    like pale pinks and yellows.
  • Cool Colours — Cool colours are made from blues,
    greens, purples, greys, silvers and whites and are more commonly
    associated with spring and summer. If warm colours denote violent, cool
    colours are said to promote a soothing effect. Blues, greens and purples
    give the impression of comfort and nurturing, making them excellent
    choices for marketers.
  • Intermediary Colours — The warmth or coolness of
    some colours can vary depending on the particular hue. For example,
    purples and greens are considered intermediary colours, because depending
    on how much red or yellow they contain (in relation to blue) they can
    be perceived differently. Less blue equals a warmer colour; more blue
    indicates a cooler color.

The Power of Colour

We know choosing colours for your web site and logo may seem trivial,
but its impact can be huge. Colour has a lot of meaning attached to it —
using your colours appropriately will reassure consumers and help
establish customer loyalty. Conversely, choose the wrong colours and you
can easily find yourself ‘saying’ things you never intended to!

The colours you choose can help brand your company in the following ways:

Categorise Your Company

Not sure how the web design colours you choose can help categorise
your company? Think about your last trip to the grocery store. What
colours did you see as you were walking down the grocery aisle? We can
guess there were red or orange signs that told you a sale was going on,
green signs to point you in the direction of the nearest ATM and tan
signs to show you where the bakery was. Remember the old black and white
labels that would immediately tell customers they were looking at a
generic label item? These are all examples of how colour can help to
categorise a company.

Colour usage is important because it gives consumers visual clues to
help them sort and categorise what they are seeing. If your company uses
bright, playful colours like bright orange, red, or royal blue, your
consumers may think you are selling products geared toward children.
That can be great if you’re selling toys for toddlers, but if you’re
selling office supplies for large corporations, you may want to revise
your colour scheme. Deep greys, pastel blues and black are often
associated with more ‘dignified’ or ‘elegant’ products. Some colours
better represent spring, while others denote winter. The wrong colour can
give your consumer an entirely different impression of your company
than the one you’re after. So choose wisely.

Set the Mood

What is your company’s personality? Is it formal, exclusive and
higher priced? Or is it friendly, casual and affordable? Certain colours
have psychological and cultural meanings that have long been ingrained
in your user. If you try and use a colour differently than what they
associate your company with, it is likely your campaign will not be
successful. Use your colours to set the mood and tone of your company.
Use cooler colours to promote a calm, serious image or warm colours for an
energetic, exciting feel.

Consumers become emotionally attached to certain colours. As a result,
different colours can convey different feelings, such as the season, or
time of day. Let’s head back to the grocery store, green means pine or
menthol; blue means mint or icy fresh; and red is found in strawberries
and apples. Would you eat something that was blue? How about purple?
Neither would your user.

In some cases, a particular colour itself often becomes associated
with a certain company or brand. If the colour you’ve targeted is
associated with one of your competitors, don’t use it! UPS has used
their colour to brand themselves as a no-nonsense company. Most people
associated UPS with their brown trucks and uniform and since the colour
brown portrays reliability, it is a colour perfectly suited for them.

Attention Grabbing

One of the most obvious things designers can use colour for is to grab
their customer’s attention. People know that using bright colours like
reds or oranges are known to catch people’s eye. As a result, a lot of
marketers choose these colours and saturate the market.

A good way to grab attention is to use seb site design colours that
currently aren’t being used in your industry. An unknown colour could
help set your company apart from your competition and make people take
notice. Of course, there could be a reason no one else is using that
colour, so watch out!

International Web Design Concerns

Depending upon the culture, colours can have very different meanings
and actually cause problems for your site. For example, green represents
movement, nature and fertility in the United States, but in other
countries green is associated with inexperience, envy and misfortune.
It’s said that in China green hats mean a man’s wife is cheating on him.
Blue may be the most popularly used colour in the United States but some
cultures believe the colour blue depicts defeat, trouble, depression or
sadness. When selecting colours, it’s important that the colour portrays
the message and the image of your company in all languages. The success
of your company could depend on it.



Bruce Clay Australia Pty Limited | Level 25,
100 Mount Street, North Sydney, NSW 2060.
1300 732 734