Colours have an extraordinary impact on our lives! Look around you: everywhere you look, you are surrounded by colour. You couldn’t avoid them if you wanted to.

Various studies have been conducted on this topic, and many have concluded that some emotions are more associated with one colour than another. For example, depression is associated with the colour grey, love with red, happiness with blue, happiness with yellow.

Colours affect our mood, our health and our state of mind. So in winter, when the sun shines less, you feel more enervated and depressed, don’t you? At the same time, if you surround yourself with more cheerful colours that boost positive energy, like yellow cushions or blankets, you’ll feel better.

This is partly due to natural phenomena linked to colour. Just think of the green of the grass, the blue of the sky, the turquoise of the sea, the yellow of the sun or the red of an apple. On the other hand, there are cultural traditions, such as the whiteness of a wedding dress or black as the colour of mourning.

And why are colours important on the web? Your website makes a visual impression on your visitors. Since images and colours are processed much faster than text, the first impression is extremely important and decisive! These 3-8 seconds will decide whether the visitor stays and becomes interested and then a customer, or whether they run away.

Remember, you never get a second first impression!

Research shows that the colour you use on your website increases your brand awareness by 80%! 80%!!! Do you feel what a huge opportunity you have in your hands?

Of course, a user-friendly interface is just as essential to the design, so that visitors to your website can find everything easily. As well as the use of other visual tools such as images.

This is based on what the site is about, what it wants to communicate and to whom. Colours are not just an aesthetic element of a website, they are also a way of communicating.

The role of colours on the website

Attract attention with colours

You can easily use colours to draw the attention of visitors to your website: on the one hand, you can use contrast, the most common examples being dark and light or black and white. This way, you can easily separate different blocks or structural units. This method is also most useful for CTA (call to action) buttons. Nowadays, there is a big trend towards so-called minimalist web design, where whitespace (negative space) is used to direct the visitor’s attention.
It’s important to know that it’s not recommended to use more than 3-4 colours on your website, and you should apply the 60-30-10% rule!

Distinction by colours

It’s easy to imagine how boring it would be if every website used exactly the same colours. Say they were all white on a white background with dark grey fonts and no other colours.
That’s why it’s important to use colour to differentiate yourself from your competitors. That’s exactly what we do in branding: we create a colour palette for your brand that meets the needs of your target group, reflects the message you want to convey and makes you unique!
You can also use your brand colours for your website, as your goal is the same: to be unique and distinctive.

Sending subliminal messages using colours

I wrote earlier that we associate different feelings, emotions and moods with different colours. A good designer will use the right colours, the right colour combinations, to guide the visitors’ subconscious in the right direction.
Just because you or your partner like a colour is not a good enough reason to use it. When choosing colours, you should take into account the nature of the products and services you offer and the characteristics of your target group.

Men’s colours – women’s colours?

Many people mistakenly think that dark colours like black, blue and green are men’s favourite colours. Women, of course, prefer pink, red and purple.
Several studies have been done on the subject, and they show that the favourite colour for both men and women is blue. (As a side note, the colour that suits everyone is also a shade of blue: navy blue.)

Introduction to colour theory

The perceived colours can be described by three parameters:

Brightness

The shades are actually the 12 primary colours. Yellow, red and blue are the three main colours. These are mixed in equal proportions to create orange, purple and green. These are the secondary colours. From these colours we get Goethe’s six-part colour wheel, where the colours opposite each other are the complementary colours, which harmonise well with each other.
Mix each of the secondary colours with the adjacent primary colour to create the tertiary colours.

Saturation

Saturation shows how much of a hue is grey. A 100% saturated colour has no grey at all, it is the most vibrant. The greater the proportion of grey in a colour, the duller it becomes. Such are the pastel colours.

Lightess

The lightest colour we have is white, followed by yellow, orange, red, etc. The darkest is black.

Colours are also differentiated according to whether they have a cold or warm effect or are neutral.
Warm colours are invigorating, they make us feel happy. These include yellow, orange, red, burgundy or brown. Cool colours are calm, quiet and serene. Blue, green and purple are described as cold colours. Neutral colours include white, grey and black. All of these colours convey a sense of calm and elegance. Their neutrality makes them very well suited to both warm and cool colours.

RGB or HEX?

When building websites, you may also encounter RGB and HEX codes.
RGB (Red, Green, Blue) is a code sequence of three numbers. Each number ranges from 0 to 255 and indicates the presence of each primary colour (red, green, blue) in the mixture.
For HEX (hexadecimal) codes, there are six characters after the # sign, each character can be a letter (a-f) or a number (0-9).
Of course, the two encodings follow the same scheme, only their notation differs. So RGB(178, 89, 181) is the same as #B259B5.

The meaning of each colour

YELLOW

Liveliness, energy, cheerfulness, optimism.
It reminds us of sunlight, so it has a warm effect and gives us a life-giving energy. It’s an eye-catching colour, just think of the taxis in New York.

BLUE

Security, stability, consistency.
The world’s favourite colour. It radiates balance, seriousness and honesty. It symbolises wisdom, confidence and intelligence. It is no coincidence that it is used by many of the big tech companies.

RED

Power, love, intensity and energy.
Red radiates courage, passion and dynamism. However, when used excessively, it represents aggression, violence and power. In the web, it is mainly used to highlight and draw attention.

WHITE

Purity, innocence, a new beginning.
The colour white triggers a heightening of our emotions. Used to excess, it can easily create a sense of emptiness. It is also an excellent background colour for websites, because it creates transparency and order.

BLACK

Elegance, strength, grief (western culture).
The colour black can radiate both luxury and loss. Depending on the proportions in which it is used, and in combination with other colours, it can embody sophistication and professionalism.

ORANGE

Creativity, success, harmony.
It is a colour of friendship and joie de vivre, it radiates dynamism. It’s very good for CTA (call to action) buttons because of its eye-catching nature.

GREEN

Nature, renewal, productivity.
The colour green conveys harmony, selflessness and security. It has a calming power. It is the preferred brand colour for organic products.

PURPLE

Elegance, wealth, pride, mystery.
Purple radiates balance, purification and liberation. The Pantone Institute in 2018 chose ultraviolet (#5F4B8B) as the colour of the year, calling it a symbol of the mysteries of the universe.

GOLD

Wealth, wisdom, knowledge.
Gold radiates elegance, exclusivity and uniqueness. For luxury brands, it can be seen in black, navy blue or deep green.

GREY

Monotony, boredom, melancholy
Grey is also a colour of compromise, as it is halfway between white and black, the two extremes. Nowadays, dark grey is increasingly used as a background colour in software. Fonts on websites are also dark grey because they are easier to read than black.

To sum up, the secret is to know the meaning of each colour, its effect on the subconscious and use it accordingly to achieve the desired effect on your visitors with positive impressions. For a good website, use colours in a way that fits the image you want to create of your brand.

What does the Pantone Institute do? What’s all the fuss about the colour of the year?

Every December, the Pantone Institute announces the Colour of the Year for the following year. In December 2021, it was the Very Peri (#6667AB).

Update: in December 2022 it was the Viva Magenta (#BE3455) the colour of 2023.

In 1963, Pantone created a standardised colour system that enabled the reliable selection and reproduction of colours. We call this the Pantone colour catalogue and it is now a standard used worldwide. It is no wonder that this outstanding achievement has made the Pantone Institute one of the industry’s opinion leaders, and all professionals look forward to December.

The 10 best and free sites for colours and colour palettes

CANVA – COLOR PALETTES

You can choose from a wide range of pre-made colour palettes in four colours. At the top of the page you’ll find a great search engine where you can search by colour code, theme or even keyword. You will get extremely good results!

CANVA – COLOR PALETTE GENERATOR

It’s really easy to use! Upload your own photo from your computer or use the site’s demo! That’s it: you’ve got a colour palette based on your photo!

CANVA – COLOR WHEEL

1. Choose a color!
2. Choose a combination! (from complementary, shade, like, triple or quadruple colour wheel colour combinations)
3. Export it! (You can save it.)

CANVA – COLOR MEANINGS

If you want to know more about the meaning of colours, you can do so on this page! You will get a million and one pieces of information about colours, all in English.

Here you can also choose whether you want a palette of complementary colours, or a palette of shades of colours, or a palette of similar colours.

COOLERS.CO/

You can also find a colour palette generator here, or browse through pre-made ones. In the latter, you can also set the style and theme of the palette by clicking on the search bar at the top. Clicking on the „Start the Generator!” button will navigate you to a new page where you will find colour palettes with pre-generated codes. By pressing SHIFT, more and more variations will pop up.

COLORMIND.IO/

Click on the „Generate” button on the main page to get more colour palettes. In the „Image Upload” menu, you can upload any stock photo you own or free stock photo and it will offer you a colour palette based on it.

COLORZILLA

On colorzilla you will find an excellent gradient maker! You can import the finished image and the CSS code that goes with it. Not to mention you can add it to your browser so it’s always at hand.

COLORHUNT

A collection of colour palettes updated daily. In the left-hand column you’ll find a super-collector’s list, with names like „Retro”, „Fall”, „Nature” or „Gradient”. Watch out, because you can spend hours here!

PALETTEGENERATOR

Based on your own uploaded photo, he creates a colour palette of dominant colours. It’s easy to use, with a short description on the home page.

PALETTR

I left the little jewellery box for last. A site specifically for designers, where you can enter a keyword (location or theme) and you get a palette of colours. I love it!

Remember:

Dare to be different!

Kriszta from NovArt Stúdió

If I can help you design your logo or corporate identity, or design and/or build your website, please contact me at hello@novartstudio.hu or refer to the KAPCSOLAT section.