Decoding Website Visuals


Picking the right visuals for your website is an important task. This is what sets your brand apart from the rest. Your visuals are your identity to the world and you only get one chance to do it. Re branding is always a possibility if you mess up the first time, but it is definitely not a very good idea as it might end up having adverse effects on the brand image. Although the recent re branding of the Pepsi logo worked out well for PepsiCo, it is always not the same case with other brands as well. Batteries made by an American company, Eveready Batteries were known by their tag line “Give me Red!”. In rural India, they were identified by their bright red colour which stood out and were usually referred to as red batteries. When the company tried to introduce a different colour of batteries, their sales dropped drastically in these areas as the ‘red batteries’ which were trusted by the people were not there any more. Even though it was the same company, people refused to purchase a different coloured battery. This affected the sales so hard that that they had to change it back to red and they have not changed the colour for their Indian products since. Therefore, it is a wise idea to choose your visual carefully.


Colour Scheme

It is an established factthat the primary point of brand recognition is directly linked to its colour. Picking the right colour scheme is crucial as this is what sets your brand image hence you have to be extremely careful. The right colour scheme can make your website a work or art! You cannot use too less or too much of colous in your website. If you use very less colours, your website will be drab and not a visual treat to the people who visit. On the other hand, if you use way too many colours, your website might end up looking like a clown at a children’s party! Moreover, the colour scheme also has to be harmonious with the image of your business or organisation. Hence, this is a critical task.

Here are a number of things you should keep in mind before choosing a colour scheme.

  1. What your website represents– The nature of your organisation should be kept in mind first, before you choose the colours. For example, if your business deals with baby products, keeping it bright and colourful is what you should opt for. But if it is to raise awareness on social issues, you should always go for somber colour.
  2. Target visitors– You also need to keep your target visitors in mind, their age, gender and nature should help you determine the colour scheme better. For example, an educational website for children should be bright and attractive. The younger the target group is, the importance of making it more colourful and fun increases.
  3. Complementary or contrast– Both complementary and contrast colour schemes can work wonders to your website, depending on how well you choose them. If you choose the wrong set of colours for your website when going for a complementary look, you might end up making it look drab or the different shades might look all the same. On the other hand, if you go wrong with a contrast scheme, your entire website might look like a terrible mess of colours randomly thrown in. Picking the right complementary theme will ensure that your website announces the web presence of your brand is an extremely classy and beautiful way. The right contrast scheme can give an unprecedented cheerful and stunning image.
  4. Company logo and established brand image– When it comes to making a website for an existing company, one does not get a blank canvas to design. It is important to keep in mind the company logo. You cannot use colours that are incongruous with the logo. For example, if the logo is bright fuchsia, it is better to avoid a striking shade of green which does not go well with the fuchsia. You also have to keep the company’s established brand image in mind. Hence, if fuchsia and green are what the company’s colours are, you have to incorporate those colours and work out the other colours you can use, in such a manner that that the website looks stunning instead of looking like a disaster.


There are usually three colours that make up your website- the primary colour, secondary colour or the accents and the background colour. You have to put adequate thought into choosing the right colours for your website.

Primary colour

This is the dominant colour of the brand. This is what the visitors will identify your website by. Hence it is important to pick the most perfect primary colour for your brand. Here is a list of some of the popular colours and what they stand for:


Red represents boldness, passion, urgency, vibrancy, danger, love and lust. It is known to incite strong emotions and has often been used in the food industry to stimulate appetite. It is perfect for websites related to fashion, power, food, love, sex etc.


It is symbol of stability and calmness. Blue is a soothing colour which incites a feeling of trust or security and hence it is often used in brands related to finance, health, technology, baby products etc.


This colour represents health, wealth, tranquility and nature. It is a soothing colour which gives off an aura of purity and assurance. It is perfect for brands related to organics, eco-friendliness, nature, food, baby products etc. It is also the colour of camouflage and hence, is a popular choice of army and army related industry, academies etc.


Yellow is a vibrant and fun colour representing optimism and youthfulness. This is used to grab attention and it brightens any colour scheme immediately. On the flip side, bright shades of yellow can put a strain on the eyes and hence has to be used carefully. It is perfect for food, shopping, health industry, websites which are targeted towards children etc.


Orange represents friendliness, enthusiasm, creativity and fun. It incites people to move and take action. It also promotes impulse expenses and hence are often used in shopping websites, food industry, tourism and restaurants.


This is a delicate colour which stands for feminine energy, sweetness, romance and innocence. Although initially pink was considered a strong colour and hence, was perfect for boys, over the times, it has evolved to become a stronger colour exuding feminine energy. It is a very good option for brands related to fashion, candy, toys, lifestyle enhancement products, gifts etc.


Purple is the colour of royalty, wisdom, success and wealth. It is a colour, which when used in the right shade and with the right colours can both excite and soothe people. It is a versatile colour which also gives a customer the vibe of being treated as a royalty. Hence, it is often used in airlines, sport teams, massage chains, luxury cruises, hotels, financial establishments etc.


Black represents power, elegance, sophistication and wealth. On the other hand it is also the colour of rebellion. It is the right colour for luxury brands be it fashion or high range cars, expensive watches, finances etc. It evokes professionalism, precision and strength.


Grey is a neutral colour which is simple and yet futuristic. It is associated with sophistication, technology and elegance. It is a good choice for brands related to technology, automobiles and even cutting edge health products.


Every colour has a unique meaning which appeals differently to the psychology of the person and hence making use of the perfect colour is the most important part. Using the right colour, you can psychologically compel your clients or customers to enhance your business. Now that you know what different colours stand for, choose your dominant colour and its right shade wisely.

Once you have zeroed in on the colour, make sure you use it in the right places in your website. Overuse of the dominant colour can be overwhelming while using it sparingly will not be able to establish it as the dominant colour. Hence, you have to find the right balance. As a rule of thumb, it should be used in the logo, on menu tabs, call to action buttons, to highlight important information and so on.


Secondary colour or accents

You simply cannot use one single colour for your entire website. That would make it look boring and no visitor enjoys looking at a drab site. This is why you need a secondary colour for the accents. Before you choose this colour, ask yourself whether it is complementary or contrasting a colour scheme that you are looking nd for. A striking contrasting theme is used to draw attention of the visitors. It is also a very vibrant choice and hence, can be used to grab attention of toddlers and children. One can make use of this for educational sites for children. It is therefore, a good choice for websites related to shopping, entertainment, arts, activity centres, schools etc. A complementary theme uses colours which complement each other, producing a soothing and classy effect. It might not grab eyeballs, but it can be used to produce an overall calming and pleasant effect. It also gives a look of stability and confidence. It is a good choice for websites related to social causes, health spas, banks and other financial organisations. Accent colours are commonly used to highlight secondary information, currently selected tabs etc. If you are unsure of what secondary colour goes best with your primary colour, you can use colour matching tools like Adobe CC to find the right accent colour.


Background colour

Choosing a background colour is not a very complex, but extremely crucial task as you have to ensure that it goes well with the other colours. It should bring out the other colours and not grab attention from them. A lot of websites go for plain white as it is neutral but that can make your pages look a bit dull. Using black as a background colour is a bold of a choice but not a terrible one because if your general colour scheme is more on the lighter side, they would look striking on a black background. But the chances of messing up due to poor planning are very high as the background colour goes darker. What kind of business your app represents, also can help you choose the background colour. For example, a bakery could use a a peach background while a high end furniture brand could go for beige. If you are unsure, it is always advisable to go with light backgrounds. Not only are they soothing to the eye, chances of messing up are less. When choosing a font colour for your background, make sure that it stands out. As a thumb rule, choose dark fonts with light backgrounds and vice-versa. If your font is not in contrast, it puts a strain to the eyes, which is not an encouraging thing for a visitor. If you are using a secondary font colour, it is important to ensure that it is clearly visible against the background too.


Your website is your primary online identity and it should be flawless. Therefore, it is of utmost importance that you do a good deal of planning before selecting a colour scheme.

Previous Post Next Post
Have a project? Call us at 8001000123 for a Free Consultation and Quotation.