Finding a Good Colour Palette through Exploration
Choosing a colour palette can often be difficult, and while there is a whole host of libraries online, a good palette is so crucial that it’s sometimes better to make one up yourself. It’s an interesting process, too.
It’s impossible to come up with a process for this kind of work, since it’s inherently creative. I use Sketch for this sort of work, but you could equally use Illustrator or even Keynote or PowerPoint to achieve the same.
Disclaimer: branding involves an awful lot more than picking some nice colours and typefaces, so if you’re looking to come up with a palette for your company, I’d suggest you hire a professional branding company.
I’m going to walk over some of the steps I recently took when deciding on a colour palette for a series of presentations I had to design, starting with this image of Zurich Airport, taken by Erez Attias. You can find hundreds more beautiful (and royalty-free images) on Unsplash.
The first thing to do is to pick some colours from the image. For now, I’m only going to pick out four: a highlight colour, a light colour and a dark colour, and one other. We can always come back to the image later.
Armed with our four basic colours, it’s time to do a little colour exploration. Although I’m no expert, I do have a basic knowledge of colour theory, which I’ll use to guide my decisions.
Exploring with Hue and Saturation
Using Sketch’s colour palette, we can decrease and increase the hue of each colour. Since we’ve got some very light and dark colours we’ll also have to adjust the saturation and brightness a little. As a general rule it’s good to keep the saturation and brightness fairly similar when playing with the Hue, and vice versa.
Exploring Using Other Tools
We can use online tools like Paletton to help us discover new colours too. In this case, I’ve calculated the complimentary and triadic colours of our original palette using a couple of different tools.
Finally, we can try adjusting overlaying our palette with white, set at 40% opacity, and with black set at 40% opacity.
Exploring with Overlays
The last thing I’m going to try is this great tip from Marko Vuletič. You’re best off reading about it directly:
When choosing our highlight colour, we could try some of the brighter colours generated earlier on.
This whole process has helped us generate an awful lot of different colours. If I remove the originals, here they all are:
Blimey, that’s a lot of colours 😧
Quite right, that is a lot of colours. I’ve found that it’s generally best to stick with four or five primary colours, one of which should be a highlight. Those can be supported by a collection of secondary colours, which can be used to to express meaning (red for errors etc), group different sections or ideas together or (as in many of my presentations), for syntax highlighting.
Now that we’ve got this mass of colours, it’s time to spend some time pairing them up and experimenting to see which go together and what they should be used for. I can’t offer any advice on that except that you should trust your gut, and consider how well the colours portray your ethos or identity.
After a bit of wrangling, here’s the final colour palette:
I’ll follow this article up with some videos on how I use colour palettes to build beautiful keynote presentations quickly.
If you enjoyed this article, I’d really appreciate it if you’d take a second to recommend it on Medium (by clicking the ❤ button), and let me know you liked it on twitter 👍.
Update: Since publishing a draft of this to some friends, it’s been pointed out that my primary colour palette is almost identical to that of Deliveroo. This certainly was’t intentional, but I can’t help but wonder if my subconsious has been affected by the fact that Deliveroo branding is all over London!
