Jump to Navigation

Color Scheme Designer - A web tool to generate colour palettes

Image to accompany story

Color Scheme Designer 3 is neat little tool that can help you generate new and appealing colour schemes. It has a slick web based interface, a wide range of options and some really great hidden features. Color Scheme Designer makes the rather complex science of colour easily available to web designers, graphic designers, and anyone else who just wants to have a play.

The interface

The first thing that hits you is the interface. It looks like the business! It's clean, professional looking grey interface reminds me why I love Macintosh so much. This is a tool that really shows of the awesome power of client side scripting with jQuery.

The ColorSchemeDesigner interface

The toolset

Color Scheme Designer offers a wide range of tools to help you get your colour palate the want you want it. First, there is the colour wheel which you can use to dictate the range of colours that will be included. Below that are several tabs, each one presenting a myriad of options to fine tune your palate. You can manually adjust the hue and saturation as well as selecting from several preset modes such as 'high contrast', 'pastel', 'pale pastel' etc.

The colorSchemeDesigner controls

Colour blindness simulations

If you're interested in accessibility the 'Vision simulations' menu will probably be of interest. This contains a list of common vision defects which you can use to preview you colour palette.

Colour blindness simulations

Preview your colours on an actual web page

It's all well and good being able to see a selection of colour swatches, but it can be quite hard to visualise what those swatches might look like when applied to an actual web page. Luckily, Color Scheme Designer provides the ability to see your colour palette applied to one of two example web pages (light and dark).

Colour schemes applied to sample websites.

Export your colour palette in your chosen formats

Once you're happy with your new palette you can export it in one of several formats. Exporting as HTML + CSS is probably the most useful. This gives you a web page with embedded css styles which you can either save as is, or copy/paste the styles into your own stylesheets. You can also export as XML and plain text, as well as special palette files that can be imported into Photoshop or Gimp.

Exporting a colour scheme as HTML.

Give it a try!

This is a really cool tool and the moment the I found it, I bookmarked it! But, don't take my word for it - go and check out Color Scheme Designer for yourself - It's free!

Please share your thoughts, comments and suggestions...

If you have your own website, enter its address here and we will link to it for you. (please include http://).
eg. http://www.kirkdesigns.co.uk