Free eBook

How to get more traffic to your website
Sign up now to download your free eBook

Choosing colour in web design

Colour is an important tool for any online business. Your core ‘offline’ brand may centre around an impulsive red or reassuring blue, but it is a slightly different story online. It’s not enough to simply daub your existing brand and its palette around a webpage; you need to find secondary colours that will strengthen and complement your business’s identity.

Choosing colours

If a brand presents well online, it’s usually because it’s based on a simple combination of basic colours.

“The most common colours are your primary colours: reds, oranges, yellows, greens and blues,” says Simon Rowell, founder of Brand Intellect. “They’re the most popular because those colours tend not to really go completely out of fashion.”

The first step in taking a brand online is to look at the colours it uses as a basis. The colours used on your website should work to support these without diluting their impact.

“There should be some sort of clear story told through the website that actually links what they’re saying online to their offline brand,” says Rowell. “It’s really about having one colour, having a consistent story, and not having any confusion. The colours used in the website really should back up the positioning that the organisation is trying to take.”

The key is to not get too carried away with supporting colours, as the focus should be kept squarely on the brand itself.

“With too many colours, you end up creating a bit of a circus effect, which ends up being no good for anybody,” says Rowell. “You just end up looking a bit like you’ve created the website at home.”

He uses the Australian website for financial services company Goldman Sachs as an example of secondary web colours trying to do too much.

“To differentiate the various sections, they’ve used alternate colours. That in itself isn’t a bad idea, but when you look at the site, it becomes a bit of a mess because they’re using primary colours against one another,” Rowell explains. “Even if they were using those colours and they were muted right down, it would look like quite a different experience; but this website looks reasonably dated, even though it’s probably not.”

Rowell singles Westpac out as a sound example of a business that has managed to strengthen its existing brand through careful selection and use of sympathetic colours online.

“Westpac uses a great deal of red through their site, but they also use a grey or platinum colour– which tends to give it a little bit more of a premium edge – as well as a light purple,” he explains. “It’s a very diluted purple that’s designed to give it a little bit more life, because the grey brings it down a bit. They’re using colours that are slightly muted, but are still getting across a mood without really competing too much with the primary brand.”

Michelle Allen, director of, encourages businesses to be highly critical when choosing online colours, and to not simply settle for a colour because they might be fond of it.

“The colour you choose will have to go with your logo. It will have to match straight away,” she says. “If you’ve got a really outdated logo, I’d look at changing that straight away.”

To give her clients a better idea of what might work to complement their logo online, Allen directs them to do some of their own colour research using an online colour wheel, such as the one found at

Find your brand’s core colour on the wheel to the left of the page, and you’ll be presented with an array of complementary and sympathetic colours, along with their hex codes (a unique code used by designers to identify colours).

The best way to understand how to use a colour wheel is to take use it to look at how existing brands might have used such a tool to arrive at their online colour palettes. The following is a concise look at some of the more common colours used in branding, and what secondary colours might support them best in an online context.


Blue is very commonly used online, as it’s associated with trust and credibility, especially in western cultures.

“There’s a natural inclination to look at the colour blue and feel a bit safe,” says Brand Intellect’s Rowell. “This is why you quite often find banks, legal companies, or insurance companies tending towards blue if they can.”

Applied colour psychology specialist Karen Haller also points out that blue is common among social network brands.

“The social media giants – Facebook, Twitter and LinkedIn – have all chosen blue to represent their brand, all using different tones that in themselves have their own subtle meanings,” she says. “Blue is the colour of the intellect, the mind, making it the colour of communication, and when you think about social media, it’s all about communicating.”

According to Anthony Bologna, design director at Trout Creative Thinking, blue is particularly useful for companies that need to elicit the customer’s trust.

“It’s really about decisions which are fairly high involvement – where there’s a high penalty to pay through making the wrong decision – as opposed to low involvement like buying toothpaste,” he says. “Choosing a lawyer or choosing a bank or an insurance company is pretty important, so those sort of companies tend towards the blues.”

Entering the ‘Facebook blue’ hex code (3B5998) into the ‘triad’ setting of the colour wheel, and adjusting the white colour points will show you how the social media service arrived at the subtle shade of green currently used in the Facebook Mobile illustration and ‘sign up’ button on its landing page.


Red is a colour most commonly used to drive customer impulses.

“Red is very much a retail colour,” says Brand Intellect’s Rowell. “It’s about passion and excitement, and impulse and now.”

He singles out fast food companies like McDonalds and Red Rooster, as well as phone companies like Vodafone, as good examples of brands that use the colour to stand out and encourage impulse buying.

It’s interesting to note that Westpac, a company in an industry that traditionally aligns itself with the trusted overtones of blue, has built its entire brand around the colour red.

“The red colour is generally associated with excitement, desire and passion in a western context,” says Rowell. “Really, what Westpac is trying to do is add a little bit of professionalism and trust by using the light purple and the grey/platinum, to give themselves a sense of stability, and make them look quite a serious company, as they are.”

Entering the approximate hex code of FF0000 into the ‘triad’ setting of the colour wheel shows how Westpac came to find its muted purple. Repeating the process with that colour’s hex code (420042) will reveal the dark grey used by in the bank’s header and text.

For businesses planning on targeting international markets, it’s wise to note that some colours have different cultural connotations in other countries.

“In China, it means good luck. In Russia, it’s a bit old fashioned, because it’s associated with communism,” says Rowell.


Given that a white background is the best drawing board for any business creating an online presence, the use of highlight colours like orange and yellow on a new website is a bit risky. Trout Creative’s Bologna still insists that it has merit as a highlight colour, noting that it’s particularly effective when used on a black background.

“It creates a little bit of excitement and an air of innovation. It’s bold,” he says. “It’s probably the strongest highlight colour that’s used all around the world. In Europe, for example, basically every street sign is yellow.”

One of the most famous examples of a consumer-facing yellow brand is that of the Yellow Pages. Note that the directory’s eye-catching brand is heavily anchored by its use of black. Similar to this is the Australian no frills label Black and Gold.

Placing the hex code of the yellow used on the Yellow Pages Australian homepage (FFDD22) into the color wheel gives a clear indication of what led the company’s designer to settle on the green and light blue of its online palette.

As with red, both yellow and orange have pointed cultural connotations in other parts of the world.

“In Ireland, orange is a religiously-charged colour, because it’s aligned with Protestantism. Being a predominantly catholic country, there’s issues there,” says Rowell.

“Yellow in the old fashioned sense in western culture, is associated with cowardice in some respects, but in Japan it’s associated with courage,” he continues. “In Egypt, it’s associated with mourning.”


The colour green is most commonly used in western branding among ecologically-inclined companies. Whether or not a business is ‘green friendly’ the use of green as a basic brand colour will summon that type of connotation for most people that encounter it.

It’s no surprise that oil company BP should have built its brand around green. A quick look at the colour wheel spectrum for its basic colour (009900) demonstrates the rationale behind the varying shades of green and dusty yellow used to underline headings and copy at

“Green’s a colour that’s become much more popular in recent years, because of the growth of environmentalism in Australia,” says Rowell. “It’s very much associated with Islam, in predominantly Hindu countries. In China green is associated with infidelity. Those sort of things need to be thought about from the point of view of a website.”

Image credit: Thinkstock

  1. fiverrr23Jz says:

    Very good article.Really looking forward to read more. Cool.

  2. elo boosting says:

    357006 317623Wow What great information. Thank you for the time you spent on this post. 187996

  3. 9208 824951Hi my loved 1! I want to say that this post is remarkable, wonderful written and incorporate almost all vital infos. I would like to peer far more posts like this . 834013

« Older Comments

Articles, ‘How To’ pieces, interviews and news, these small business web design ideas and advice will help ensure your company has a website to rival all others. From colour palettes to branding, right through to technical applications and coding, NETT offers mixtures of articles guiding and inspiring you through every step of web design for small business.