P.A.D. – Post #2: Color Tools

by Christopher Paul on October 13, 2006

This one has to be quick.  I’ve got lots of work to do today.

I’m changing the theme again because I want to add a little more color to the site – make it more energetic.  I still want to keep it light and image free so I downloaded K2 and installed it.  So far, it looks ok but it looks like every other K2 theme out there.  I’ve got to come up with a new color scheme for it and then, I think, it will look good.  To do that, I’m using two sites that help web developers get the right color combos.

The first one is an old favorite of mine and it’s a free offering from VisiBone called Color Lab.  VisiBone sells ‘cheat sheets’ for HTML, CSS, javascript, fonts, and other website related topics so when coding, one doesn’t always have to look at a large book or toggle between windows to find information.  And while I haven’t purchased their books or cards (but tempted to), I have used their free tool.  That tool shows you a 216 color pallet that displays the hex, RGB, and CMKY values for any color you select.  As you select other colors, it shows how the previous color looks next to the newly selected color and you can view up to 8 color sections at any one time.  You also see how each color would look as a background and foreground color so you can pick 8 colors and see how they look as text, links, hovers, background, and headers together.  You can do all this without even having to code yourself – it takes the trial and error out of the color selection process.

The other site I am using is the Color Palette Generator from DeGraeve.com.  Steve DeGraeve has created a wonderful set of tools that anyone can use.  There are too many to list but check them out here.  The palette generator, however, lets you take an image on the web and create hex values of the colors in that image.  If you like a company logo, for example, point to it and let his code tell you what the colors’ hex translations are.  I’m tempted to take some color swatches from Home Depot, scanning them in and posting them to this site and use Steve’s tool to do its thing.  I’m even thinking of taking screen shots of other websites and using those colors for inspiration.

Ultimately, I’m not sure what I’ll do color wise, but these two websites are going to help me.  If you are into HTML, CSS, and design.  These two offerings may help you pick the right colors.

Previous post:

Next post: