Steve Workman's Blog

Adding colour to colour theory

Posted on by Steve Workman About 2 min reading time

BluBar Colour palette

This is the first in a short series about my blog re-design. I'll try and cover all the techniques used, including CSS3 and HTML5 usage

When considering the colour scheme for this blog, I looked at my old one quite a bit and decided that I quite liked it. Based on the resolution that blog design should be evolution rather than revolution, I set about finding a suitable palette that matches the silver, yet provides a bit more of a range of colours.

My first, and only, stop was the wonderful Colour lovers, whose search engine for "electric blue" brought me the keystone to my design. Straight off the back of that I found the "BluBar" palette which gave me the matching colours to create the design.

Off to a great start, I made the whole thing using only those 5 colours and some gradients.

Still, when I came to look upon the design at the end, I was disappointed. The whole site looked very dark, and since the elecric blue was used for borders and links, there was little to catch the eye.

What I learnt, immediately, is that there needs to be another bright colour that can add intensity and be used in the opposite end of the spectrum. So, I started looking for my elusive opposite: electric orange.

There were quite a few results on colour lovers, but I eventually plumped for this one: electric orange (#ee7300) - a darker orange that brightens colours around it without being too brilliant a colour. This is almost exactly the complementary colour (apparently #ffa100 is the theoretical match) but it's close enough. Just shows that knowledge of colour theory is essential for designers

This new colour will be making its way into my design slowly as I get chance to work on it. I'm still not pleased with the way it looks at 1024*768, there's a few bugs too and after last week's rant about css3 multi columns, I think I'll drop it from the footer.

Watch this space