Colour contrast tool

I heard Lea Verou give a talk about colour in terms of design and development at Smashing Conference Oxford in 2014. She knows such a lot and has tons of information on her website.

She has created a brilliant colour contrast tool here:

This is totally different from other contrast tools as you can also check opacity too.

The reason I’ve been interested in using it is that I’ve been working with online maps and how to best show weather (rain, temperature etc) as a layer over the top of the map. Not actually how you technically get the map to show but how you would display it so that you can best see and interpret it. When you start looking into it there are lots of variables – what type of map background do you need (e.g. terrain, satellite, placenames, roads etc) and then how to best display colours on the top to show each weather type – singly or multiple layers.

Opacity needs to be used so that you can see the map features underneath but you also have to be careful that you don’t wash out the colour or change the colour (by it mixing with the map colours underneath) so that you can’t tell what it’s showing.

That’s why Lea Verou’s contrast tool is coming in handy in figuring this stuff out.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s