Skip to content
The Impact of Colour in Web Design
  • By Luke Covell

    Website Designer

Colour Psychology. The colours that are used on a website are totally dependent on what colours you are wanting to help brand your company. It is important to note that colours can affect people both consciously and unconsciously, in terms of how the colours make the person feel about the website. For reference, the image below shows a colour chart with the perceived feelings that come from certain colours:

Blue is one of the most-used colours, there is a lot of reasons for this, for example, blue is viewed as the colour of trust, confidence and loyalty. Companies such as PayPal use the colour blue, chances are this helps improve the trustworthiness of the business. If they tried red or yellow as a theme for their branding, they might not have had the same level of conversions for the business. The colour blue is a great all-around colour however, it should not be used in relation to food as the colour blue has been associated with a lack of appetite and would negatively impact the website.

Colour psychology is not an exact science however has been shown to affect a person's perception of websites and other designs. There is also societal considerations that have to be taken into account as well such as gender as this can affect how a colour is perceived by an individual. Usually purple is a colour that is universally liked by women but can be a disliked colour by males. This can be important to remember when choosing colours for a site that has a larger demographic of one gender to make the overall site more suited to the target audience.

Using bright primary colours for your call to actions is one way that you are able to generate more conversions on your website. Testing has been carried out to determine that bright primary and secondary colours (such as green, red, yellow, and orange) produce a higher conversion rate than darker colours (such as black, brown, or dark grey). 

Colour Schemes

When choosing a colour scheme for a website some consideration needs to be made into if the site is wanting to be monochromatic (using different hues of the same colour) or if you are wanting to choose multiple colours for the site. It is as important to make sure the colours that are going to be used on the website look good on their own as well as when used with each other. It can be tempting to go for a rainbow colour scheme when trying to look for colours to make the website stand out however, the most impactful websites tend to be limited to two or three colours maximum.

There are multiple different ways that you are able to identify colours that work well together one of these is to learn by example and look at other companies websites to see which colours they have used together. There are also multiple sites such as Adobe Color CC and Paletton that allow you to view different colour palette methods to see a colour scheme based on a colour that you have selected.

Issues with Colour Choices

Consideration needs to be taken with the colours that are used on certain backgrounds. Light colours on light backgrounds won't be very visible and might cause issues in the same way dark colours on dark backgrounds would cause issues. To Avoid this from happening is simply making sure that there is enough contrast between the background and foreground colours that have been used.

There are also colours that when used with each other can cause issues for people who are colour-blind some of the worst combinations of them are:

  • Green & Red
  • Green & Brown
  • Blue & Purple
  • Green & Blue
  • Light Green & Yellow
  • Blue & Grey
  • Green & Grey
  • Green & Black

If a combination of these colours is wanted to be used for example green and brown on a gardening site it can be done it just needs to be designed making sure the colours don't overlap as that is what causes the main problems with these colour combinations.

Most popular

GET IN TOUCH

If you would like to chat to us about making your online NAP listings more consistent

  • This field is for validation purposes and should be left unchanged.

Sign up for our free tips on how to build your business online