Using Colour on Your Website - Picking Your Colour Palette
As explored in the previous Using Colour on Your Website guides, colours can have a significant effect on the success of your site. However picking a colour scheme/palette can be pretty daunting as there are so many things to consider. The previous 2 guides cover some of these factors. The Basics covers issues such as contrast and where to draw inspiration. The Colour Psychology post explores the way that people react to certain colours.
Having a colour scheme is important; it helps to create uniformity across your site. It's essential to have a set of colours that compliment each other. If your site is a mish mash of colours that don't match or even cause eye strain visitors will not stay on your site. Luckily there are plenty of tools that can help you to pick a palette. In this post, I'll outline some of the tools that you can use for help.
Most of these tools use colour rule to create harmonious colour palettes taking a lot of the stress out of picking a palette on your own. As most of these tools use the same methods, I have listed the tools which have a friendly user interface, and that have some great extra features.
Adobe Color CC (Formerly Kular): This has an intuitive and easy to use interface, it's also quite fun to play with. Creating your palette is simple, with a selection of colour rules to choose from. You can also create a palette from an image. The Explore option allows you to draw inspiration from themes created and shared by other users.
Paletton: This also has an easy to use interface. There are a few nice touches, such as the Preview option so that you can get an idea of how a web page would look. There is also a visual simulation to show how the colours will appear to colourblind visitors.
Mudcube Color Sphere: A nice user interface again, the Harmony tab allows you to flick between the colour rules and the Vision tab again gives you the ability to simulate visual impairments/conditions. However, there isn't the option to change the Hex code manually (which is unfortunate if you had a colour in mind).
Colors On The Web - Color Wizard: This is a much more basic, no-frills tool. However if you have a starting colour in mind and Hex code, then it's pretty useful.
COLOURlovers: This is an online community for those that love colours, it's handy to draw inspiration from. There's also COPASO their colour palette tool, it's a little harder to use and get to grips with than some of the others listed.
SpyColor: Like Color Wizard, this tool is more powerful when you already have a starting colour and Hex code. After entering your colour, you are shown a selection of colour schemes as well as tints and shades. There is also a handy section at the bottom, showing your chosen colour as a background, text and border.
Coolers: Quite fun and easy to use, you can also generate from an image. There is a colourblind simulator. I would strongly suggest taking the time to look at the tutorial, it's very short and explains all the functions available.
Color Hunter: This again is for picking a palette from an image. It's easy to toggle the dull/vibrancy and to pick new palettes from the original set created.
With so many great tools out there, picking your colour scheme doesn't have to be so hard (it can even be fun). There are a number of tools for all needs and levels of experience. Whether you have a few colours in mind, or need some inspiration to get started, there is something for everyone (without having to learn all about colour theory).
I'd recommend taking a look at the Using Colour on Your Website - Colour Psychology guide to get some ideas and to perhaps look at what colours you may want to get started with.
Freeola also offers a choice of affordable website design services. So if you would like some help with the design of your site, check out our Web Design page.
Freeola & GetDotted are rated
Check out some of our customer testimonials below:
Need some help? Give us a call on 01376 55 60 60
It appears you are using an old browser, as such, some parts of the Freeola and Getdotted site will not work as intended. Using the latest version of your browser, or another browser such as Google Chrome, Mozilla Firefox, or Opera will provide a better, safer browsing experience for you.