Last updated: December 7, 2022 Julija Popovic
Colours were always fascinating to humans. There’s no need to repeat that, so, we won’t go over it here. Everything important has already been said. Rather, we will focus on the importance of colour in digital design. That’s why we’re all here.
In real life, we perceive colours when light hits objects. Of course, on screens it’s a bit different. That’s why digital art often looks different printed than on screen.
In other words, our brain tricks us into seeing colours that don’t exist in the real word. They exist only in the RGB light of our screens.
Therefore, shades can have a powerful influence on us, and it happens even without our knowing. That’s why interior design magazines and blogs talk of calm or dynamic colours. Too much of a “calm” shade makes a space drab, and too much of a “dynamic” one makes a space unsettling.
We could use a similar principle in designing digital interfaces. Colour palettes can often make or break a design, which is why knowing how to make a good one is so important.
To help further, we chatted with Ronit Cyjon - Head of Design at Elementor, who shared her advice:
"Keeping mobile responsive in mind when crafting your color palette will often transform your design process, making it far more seamless. This way, you can guarantee that your text elements are equally legible regardless of screen size, and that icons and buttons are also just as visible on mobile as they are on desktop,"
"Given how much smaller mobile screens are than desktop view, you may find that you’ll need to use fewer colors for mobile than you do for desktop. The smaller interface might look overwhelming if it has too many colors, yet the added space you have on desktop can handle a larger number of colors without seeming too busy. Adding multiple shades of one color to your color scheme is another great trick. The similarities between the color shades are similar enough that they’ll make the mobile interface look clean and cohesive, yet different enough to keep your website interactive and engaging."
In this article, we will first take a look at some basic colour harmonies. What are colour harmonies? Simply put, they’re combinations of hues. We recognise pleasing colour combos on a subconscious level. Even before we learn about basic colours in primary school. It all comes back to the colour wheel.
There are several types of colour harmonies: each of them has its own strengths and weaknesses. It’s vital to know when to use them. We’ll take a look at a few basic ones.
And a special thanks to Coolors for these combinations!
Now let’s take a look at our colour wheel. Analogous colours are the ones right next to each other. Let’s take the lovely crimson, magenta and lilac colour: their common colour is red. There’s crimson which is the reddest, while the least red is lilac. These colours are a part of the same family. Analogous colour palettes are more calm than others.
They are cohesive and create a unified look.
But, they can be kind of tricky to execute.
Why?
They can often appear bland and monotonous. Designers should bear this in mind. When done well, they lend designs sophistication and elegance. Analogous colour palettes are high risk high reward. A good idea might be to introduce patterns. That way you add visual interest. You don’t need high contrast to make a design pop.
But many designers use high contrast for a reason: it’s the fastest way to grab attention.
Complementary colours are on the opposite sides of the colour wheel.
What does this mean?
It means they contain all basic colours. Let’s take yellow and purple for example. Yellow is a basic colour. We need red and blue to complete the set. So we take purple because it has both of them.
You can use this principle on any combination. Colour wheels are your friends. Complementary colour palettes are high energy. They draw the users’ eye and make a design pop. But they can be jarring. A little brightness is good. A lot of it makes users unnerved.
Complementary colour palettes are great for projects for younger audiences. They are bright and cheerful. They make a lasting impression.
A triadic colour palette has three colours. They are evenly spaced on the colour wheel. This colour palette is stable, but impactful. You can make it as dynamic as you like. But, you should be careful. The colours mustn’t clash.
So, consider having one main colour. Then you can add details in the other two. Little pops of colour to make things more interesting. That way you get the best of both worlds. You can make a statement. And your design is pleasing to the eye and user-friendly.
Triadic colour palettes are very versatile. Designers use them in all sorts of projects. They give designers lots of space to experiment. They can make tweaks and customise them to perfection. Triadic colour palettes are a great fit for many projects.
Tetradic palettes follow a similar principle to triadic palettes: they have four colours. Usually, they combine two cool tones like blue or teal with two warm ones like yellow and orange.
Tetradic palettes are high contrast. This means they can become jarring. You need to take care that colours work together. It’s best to use the same approach as with triadic palettes. You should have one main colour. Then you can add details with the others.
You can even take a pair of main colours. You just have to make sure they don’t clash. Harmony is very important in complex colour palettes. But, that makes them more fun and dynamic.
Tetradic colour palettes are best for large projects with lots of elements. That way you can make best use of each colour. They are incredibly vibrant. This will make a design pop. They are tough to do well, but yield good results.
Basics are out of the way. Now we can focus on practical tips. These are by no means rules. There are exceptions to each of them. You shouldn’t look at them as a checklist. But, they can be good guidelines.
It doesn’t have to be a comprehensive plan, but, you should have an idea of which colours you want to use.
Think about what kind of colour palette you want to use. You can even make a moodboard - they can be great for feeling out the character of a project.
Therefore, a good idea is to play around with coloured pencils or watercolours. Try out a bunch of combos on a sheet of paper. That way you’ll have a good idea what you like. Of course, colours are different on screen. But, you’ll have a number of pairings to choose from.
Outlines can help you keep track of your ideas. They serve as a touchstone during the designing process. They keep the vibes that you’re going for with the project.
Sometimes ideas work better on paper. They might look off when you apply them to your design. This happens often. But, it’s no reason to panic. Look at it as an opportunity to create something new.
Your original idea is a jumping off point. It can work out in the end. But if it doesn’t, it will lead to one that will. You shouldn’t stress if the end project isn’t the same as the idea. Projects evolve and change. Designing is a fluid process.
Having a plan is great. But don’t be afraid to elevate your ideas. Tinker and play with them as you go along. Maybe you’ll discover something even better.
Are there similar websites or apps to your project? Take a look at them and analyse them. There are strengths and weaknesses to any design.
It’s the same with colour palettes. You should use the experience of others. Take a look at colour palettes that work and those that don’t. Ask yourself why that is.
You can find inspiration in unexpected places, too. The digital space is enormous. Explore it and you could find incredible things.
Research different layouts. Layouts are important for colour palettes. They can help you decide which colours to use. Or which colour should be your main colour. That way you can compose a beautiful and vibrant palette.
It’s easy to get swayed by a really cool design. It’s normal to want to try it. After all, that’s how you know it’s an effective design.
That said, there’s no need to blindly follow trends. Yes, they exist for a reason. But they saturate the digital space. A colour palette makes a first impression. And a first impression needs to make an impression.
It needs to stand out. It should grab attention, and it also needs to be good. There’s a lot riding on it, true. But, it’s what users first notice. A colour palette is like a project’s calling card.
So, keep your idea in mind. After all, originality is the best way to make an impression. And there’s no need to limit yourself to popular palettes. A wave of similar designs could drown yours out. You want the user to remember your project.
People might not remember details about it. They will remember that site or app with the lovely pastel colour palette. A pastel palette was just an example. It can obviously be any type of palette. As long as you create it well.
Sometimes we look at our creation for too long. We start to see flaws everywhere. Or we miss something that is hindering the design.
A fresh pair of eyes can do you a world of good. If you have doubts about your colour palette ask a friend. They don’t have to be a designer. People outside of design circles can often be invaluable. They are your target audience, after all.
Doubts can creep up anytime. We all need someone to reassure us. A beta viewer can tell you what’s missing. Burnout can get to us all.
You can ask them if the colour palette feels right. They’ll often tell you right away.
Setbacks happen. A colour palette can seem really great at the beginning. Then, it turns out bad. It’s more common than you’d think.
It’s important to take a step back and examine your progress. You can fix any misstep. But, you need to notice it first.
The palette’s wonky? Analyse what went wrong. Maybe it’s just a matter of a few clicks. Maybe you need to come up with a different palette. Try to work out the problem. Everything’s possible to fix.
The next time you hit a snag, breathe. You’ve got this. Be happy you have the chance to create something better. A colour palette should be fun. And you should have fun creating one.
Are you designing a site for baby and childrens’ clothes? Aggressive colours might not be the best ideas. Sure, pastels and white are predictable. But, you can find ways to be creative. There’s no need for dramatic, bold colours.
You should have communication with your client. Find out about their idea for the project. They might help you envision the final product. You should explore different options.
Think about the project. What is its main goal? What are the aesthetics that fit it? You could even make association bubbles. They help you get many ideas out there. And then you can mix and match different ones to make the best colour palette.
Colour palettes set the tone for the entire project. They need to be effective and convey the intent of the product.
You might get an amazing idea for a colour palette. But, it’s not the right fit for your current project. That doesn’t mean it’s not worth your time. You shouldn’t scrap it altogether.
Ideas are valuable. And having lots of them is like having a treasure chest. So save your ideas. They can help in so many different ways. They can work on their own. Or, you can combine them and create something new.
Consider having an “idea scrapbook”. Write down any ideas you get. That way you can come back to them. Especially if you hit a roadblock with a project. These old ideas can spark inspiration. You can use them for other projects.
Almost all ideas have values. They might need a little tweaking. But, you can and should use them.
This is an obvious one. But, it’s amazing how often people overlook it. Your client should get a say in the project. After all, they’re the one tied to it the most.
You should have a sit-down with your client. Find out what they want. Do they have a specific idea for the project? Find out if there’s something they’d absolutely hate in the design.
Try to come up with several ideas. That way it will be easiest to find one everyone loves. Listen to your client’s input. They might give you a whole new idea for the project.
Pitch your vision and see how it aligns with theirs. Communication is key. You can avoid many issues just by having clear lines of communication. You will be able to make the best decisions. And your client will be happy.
There’s no strict set of rules in designing a colour palette. Colours can be very subjective. It’s an emotional process. Colours impact our feelings, even if we’re unaware of it.
You should be aware of this impact. Think about emotions different colours create. Have that in mind when you choose a colour palette.
The practices in this article are just a stepping stone. Everyone finds their own style. Choosing a colour palette is different for every designer. Don’t be afraid to experiment.
Last updated: December 7, 2022