Colour is something that designers work with on a daily basis. Whether designing an app or finding the perfect colours to match a company’s brand message, it is integral to good design. The importance of colour for people in general cannot be undermined as it affects moods and has cultural significance. We discuss colour meanings and what it means for designers.
Colours can be divided into two main categories, warm colours and cool colours. Warm colours would be red, orange and yellow with orange being the most neutral of these. Warm colours are usually associated with passion, energy, enthusiasm and excitement. These are also the colours of fire. Red, for example, is often associated with anger and danger (think of the fact that many warning signs are in red) Yet, in countries such as China, the colour red represents prosperity.
Cool colours are more subdued than warm colours and are colours that can often be found in nature scenes, water and at night. Blue is the only primary colour in this spectrum while other colours such as purple and green take on the attributes of warm colours (for example, to make purple you need to mix blue and red) making them secondary colours.
These cool colours are often associated with calm, abundance (green), peace (blue) and spirituality (purple). A colour such as purple is often also associated with wealth, luxury and royalty. In Taiwanese culture, however, purple is the colour of mourning (in other cultures it is more often than not black).
One also gets neutral colours such as black, brown, grey and white (along with variants of these such as tan, beige, ivory and so forth). These are often used as backdrops on websites and are then combined with more colourful accents to add dimension. Black often represents mystery and power but sometimes also death when used in another context. Greys are seen as depressing and brown is earthy and dependable. White is very often used in minimalist design with it being great for letting other colours shine. It can be associated with the healthcare industry since it is seen as pure and clean.
Colour has its own terminology. The word “hue” is used to describe colours such as red, blue or green. So, one would say, “The red is a great hue to use for this website.” Chroma describes the purity of a colour. Adding black, white or grey to a colour reduces a colour’s chroma (or in other words, describes the brightness of a colour). Pastels are considered to have a reduced chroma.
The value of a colour is how light or dark a colour is. The lighter a colour, the higher value it has. A colour like black has a low value because it absorbs other colours (that is why standing in sunshine while wearing black makes you feel hotter than when wearing other colours). White has the highest value.
The word “tone” is used to describe a colour that has been mixed with grey and when a colour has added black it is referred to as a shade (since it is being made darker). When adding white to a colour, you will get a tint. Pastel colours are often called tints because it is, for example, red mixed with white to get a light pink and then it is lighter than the original colour.
Designers need to create colour palettes. This is done by putting colours that suit each other together in order to use the combination of colours on a website, logo or other design. There are some predefined colour schemes that work time and again.
Monochromatic colour schemes are tints, tones and shades made from a specific hue. These are the most simple colour schemes and more difficult to create a jarring or ugly design with since it is variants of only one colour.
Analogous colour schemes are schemes created by choosing three colours that appear next to each other on the 12-spoke colour wheel used by all. These colours have the same chroma but tints, shades and tones are thrown in to add dimension and interest.
Complementary colour schemes involve combining colours that are placed on the opposite ends of the colour wheel to each other. These usually only involve two colours with variations in between. Don’t use colours that have the same brightness or chroma next to each other as it is very harsh. Colour example will be red and green as they are opposite each other on the colour wheel.
Split complementary is the sister of the complementary colour scheme. Instead of using the colour that is opposite on the wheel, you use the colours to the left or the right of the opposite of your base hue.
The last colour scheme that will be discussed is the triadic. The triadic uses colours that are equally spaced in between each other. You choose one hue and then every second hue on the wheel. This colour scheme is usually very vibrant and bright even if you use pale or unsaturated versions of the colours.
In your colour schemes, always try to add in some neutrals to balance everything out. Neutral colours will also change in look and feel depending on which colours you are surrounding it with. Yet, browns, tans and off-whites tend to make colour schemes feel warmer since they are just variants of orange and yellow (which are warm colours).
How many colours should one use in a colour scheme? The fewer colours you use, the less complicated things will be. Many sites use only three colours while others prefer two. The use of five colours in a colour scheme is the most popular as it is great for illustrating concepts. Start with a palette of five colours and then add or subtract as you go along. You can even use a predefined traditional colour scheme (one that many people use for their sites) and then add or remove colours from this as you go along.
There are obviously many other colour schemes that you can create yourself and colour theories you can apply. But always be wary of using personal preference above what is best for a company’s brand. Find out the company or business’ personality and culture is, and what the meaning behind the colour is that they prefer using. This will help you determine what the mood of the website, app or whatever it is you are creating will be and what the message the brand will convey to customers.