Colour psychology.

What colour psychology studies

Colour psychology describes the associations and reactions that different shades evoke. Blue is most often linked with reliability and calm, red with activity and urgency, green with nature and safety, black with expense and austerity.

An important caveat: these are not laws but patterns, and they work in context. The same red in a bank’s interface reads as an error, and in a sale as a bargain. Meaning is given to a colour by the situation, not by the colour itself.

So the practical value here lies not in a “colour — emotion” table but in understanding that the choice of palette is a decision that affects behaviour, not a matter of the owner’s personal taste.

How colour works on a website

The first job is the first impression. The palette is read before the text and immediately sets the feel: expensive or cheap, modern or dated, serious or not.

The second, more important job is visual hierarchy. Colour sets priorities: what is primary, what is secondary, where to look first. That is how a person finds what they need without reading the whole page.

The third is navigation. Links, buttons, active states and headings must differ from ordinary text, and differ in the same way across the whole site. When the same role is coloured differently in different sections, the visitor stops understanding what can be clicked.

Button colour and conversion

There are many myths around button colours. There is no “best colour”: what works is not the shade itself but its contrast with the surroundings. A button is noticeable when that colour is used nowhere else on the screen.

So the rule is simple: pick one accent colour and give it to target actions. If headings, icons and borders are painted the same colour, the button gets lost, however bright the shade.

Everything else is checked by testing. Comparing two variants on your own traffic gives the answer for your site — and that answer may not match other people’s conclusions, because it depends on the background, the audience and the offer.

How to pick a palette

You start not with colours but with the task: who your audience is and what feeling the brand should leave. A company working with eco-friendly products suits greens and natural shades; a premium service, a restrained dark range.

• One primary colour — brand recognition rests on it.
• One accent colour — only for buttons and target actions.
• A neutral base — background, text, borders, shades of grey.
• Utility colours — success, warning, error. Their purpose must not be changed.

More colours does not mean better. A restrained palette looks more expensive and makes the work easier: you do not have to decide every time which shade to paint a new element.

What to consider before launch

Consistency. The palette must be the same on the site, on social media and in printed materials, otherwise the brand is not remembered. The easiest way is to fix it as a list with exact values and a rule for where each colour is used.

Checking on devices. The same shade looks different on different screens and in different lighting. What looks beautiful on the designer’s monitor may be unreadable on a cheap phone in the sun.

Cultural context. The meanings of colours differ between countries and audiences: in some places white means purity, in others mourning. If you work beyond the Russian market, this is worth checking.

Accessibility and contrast

The most common mistake is light grey text on a white background. It looks neat in the mock-up and is unreadable in real life: in bright light, on an old screen, for people with weakened eyesight.

The contrast between text and background is checked with automated tools, and this must be done before the build, not after complaints. States are checked separately: an inactive button, text on a coloured background, labels in forms.

One more rule: do not convey meaning by colour alone. A form error is highlighted both with colour and with text, otherwise some visitors simply will not see it.

Frequently asked questions

How many colours should a palette have?

Usually a primary, an accent, a neutral base and three utility colours are enough. The fewer the colours, the neater the result looks.

Can I take a competitor’s colours?

Better not. The point of a palette is that you are told apart. It is more useful to see which colours in the niche are taken and pick a free one.

Is it true that a red button converts better than a green one?

There is no universal rule. What matters is contrast with the background and the uniqueness of the accent on the page, and the specific shade is checked by testing.

Does the palette need to change in a redesign?

Not necessarily, and often it is undesirable: colour is the most recognisable part of a brand. Changing it only makes sense together with a change of positioning.

What to do next

Open any page of your site and count how many different colours are used on it. If more than five, start by cutting the palette down and making sure the accent colour stays on buttons only.

We put together palettes and brand identities — that is design and branding. After that, our guides on how to make a call to action on a site and how to run A/B testing will come in handy.