Lately, I have started using more and more D3 for visualisations. Having used it at work for various projects, we had to adjust the colour palette of each project accordingly. Since D3 uses SVG for graphics, I started looking at the <color> tag.
Apart from the tag definition, W3C provide a list of keywords one can use instead of RGB values; this is extremely useful, as one can use the following to produce code that makes sense the moment you look at it:
var colours[lightsteelblue, lightskyblue, deepskyblue];
A list of keyword per RGB <color> is here. That was very useful, but I needed more than a list on the web. I looked for a cheat sheet on the web but didn’t find any. So, I did the following.
Firstly, I wanted to colour-sample when building mockups, so I made the following images (feel free to download):
Moreover, I wanted to look at this list even before turning my computer on, during sketching phase. So, I put the images above in a printable color-keywords cheat sheet [pdf].
Enjoy these resources! 🙂