Page style:

A Blue Perspective: Technicolor

Technicolor
4 March 2004

» Technicolor web colour designer «

In that grand tradition of me going one step further than is necessary, I present the Technicolor web colour designer. Inspired by the recent proliferation of colour theory discussion I thought "it's all well and good having these delicious colour palettes floating around, but how do they apply to a web page?"

So, Technicolor not only gives you some colour combinations to try out on people with atypical monochromatism, but it also allows you to paint a web page in your chosen psychedelic mood!

Once you've selected a nice looking colour using the colour sliders, you can select any of the 12 colour swatches by clicking on it once. This makes the colour active, and anything you subsequently click on the mock web page will be painted that colour; and I mean anything! (ignore your cursor icon!) Change the page background colour, left column text colour, header background colour, highlighted menu item text colour, right column background colour, menu background colour ... you get the idea.

If you've chosen a colour using the sliders and like one of its variants, you can get variants of the variant by double clicking on it. If you like the overall colour scheme of the variants, you can auto-paint the web page using those colours by clicking on the strangely labelled "Auto-paint the web page" link.

Now for a disclaimer: some of the variations are pretty eye watering and The Man in Blue Co. (est. 1863) accepts no liability for damage to viewers' retinas. They tend to look best with pastels, not highly saturated individual components e.g. pure red. (if anyone has any good looking colour variation algorithms they can tell me about, feel free)

I personally don't have much trouble with colour choice (I hope ... nothing wrong with blue), but if this tool helps someone else, then my visit to Earth will not have been in vain.

Tested and Ok'ed on IE6, NN7, Moz1.5, FB0.7. Thumbs down on Opera 7.11.

Comments

1/23. 4 March 2004 @ 15:52, kartooner wrote:

Awesome job, Cameron. I've been looking for something like this for awhile.

Granted, Color Schemer (www.colorschemer.com) is a great offline tool and has a cool online color tool, but this is perfect to see the whole picture.

Thanks for sharing this. Your work is appreciated.

2/23. 5 March 2004 @ 01:32, RMCox wrote:

This is realy cool. It doesn't work in Safari, however, it does of course work in Firefox, so Mac users do have that option I suppose.

Another good resource for color picking is available here: http://www.pixy.cz/apps/barvy/index-en.html
That doesn't give you the perspective insofar as layout and overall color composition are concerned, though, and your example fills that void.

3/23. 5 March 2004 @ 01:38, RMCox wrote:

D'oh! Really, not realy. No, really.

4/23. 5 March 2004 @ 08:39, Joe wrote:

Add a new feature to tell all possible moves in a game like http://stuff-by-magnum.com/ScrabbleScam.html

5/23. 5 March 2004 @ 11:52, Curt wrote:

This is pretty cool. I've been playing around with other color schemers online, but I didn't find anything that let me put colors together quite like this. I think I found my new favorite. :)

6/23. 5 March 2004 @ 12:47, John wrote:

This has found my Bookmarks. What a great concept and implementation.

Thanks!

7/23. 5 March 2004 @ 16:35, Tom wrote:

I don't think he intended this to be a place to post links to other color schemers... :-\

Anyway, I think this is a great tool. It would be better if you could manually enter a hex code.

8/23. 6 March 2004 @ 03:09, andrej wrote:

offline version somewhere?

9/23. 6 March 2004 @ 06:24, Jennifer Grucza wrote:

This is beautiful! So simple, and yet so very useful! :)

10/23. 6 March 2004 @ 07:30, Dougal Campbell wrote:

Any chance you could add a feature that would generate a skeleton CSS file based on the current color settings on the page mockup?

That would r0x0r.

11/23. 6 March 2004 @ 10:27, neezee wrote:

Very nice tool.

A css based file would be great but I would even be satisfied with a

'click here and I'll show you all currently showed colors from the boxes on the left'

and

'click here and I'll show you all current selected colors for the right'

because you can choose different colors from various selections - but if you want them documented you are busted.

Second: yes please add a possibility to give a start color via hexcode.
thanks for a new playtoy.
Nicole

12/23. 7 March 2004 @ 07:05, manuel razzari wrote:

simple, beautiful, useful!
Impressive, Cameron!

13/23. 8 March 2004 @ 04:05, Christoph C. Cemper wrote:

This is really great stuff Cameron... I have to redesign my own coloring now...

Regards,Christoph

http://weblog.cemper.com


14/23. 17 March 2004 @ 02:23, Hasan wrote:

I've been using this for almost two weeks now,
thought I'd better say thanks. Thanks!!

15/23. 6 April 2004 @ 07:28, Sarah wrote:

This is a really amazing tool.
The idea of applying the generated colour palette to a sample layout is brilliant.
Very nicely done! Thank you.

16/23. 8 April 2004 @ 02:57, Mario wrote:

Awesome tool! congratulations!
I think i will use it very much for my designs.

Thanks.

17/23. 27 April 2004 @ 05:54, Joseph Lindsay wrote:

Thanks for a cool tool. I am sure that I will use this a lot.

18/23. 3 May 2004 @ 15:51, John Rolph wrote:

A very useful tool. I was looking just for this, with layouts in line. brilliant!

Thanks for this!

19/23. 25 June 2004 @ 01:21, Mark wrote:

Many thanks. I'm slightly colourblind and have little artistic talent: this helped me a lot in my site redesign. In fact, I liked your default colour scheme so much I just nicked that!

20/23. 25 June 2004 @ 01:49, The Man in Blue wrote:

Just as long as you know that #0066CC has been copyrighted by this site and any infringement will be met with swift justice :oP

21/23. 25 June 2004 @ 18:23, Dagmar wrote:

Thanx for that great tool. It is really useful. Have searched the web the whole day and finally found your site... what about an offline tool? Is there any or will there be?
I would like to have it ;)

Have a nice day then
Dagmar

22/23. 27 June 2004 @ 00:10, The Man in Blue wrote:

Offline tool ... hmmm. Not sure if I could be bothered, but theoretically you could download all the files onto your hard drive and it'd still work -- all the references are relative.

23/23. 26 July 2004 @ 20:18, Joe wrote:

This is a great tool and its exactly what I would need to create in a project Im working on.

Is it ok to use your code? Pretty please with sugar on top?? :)

Post your own comments

Fields marked with an asterisk* are mandatory. All HTML tags will be escaped. http:// strings in comments will be auto-linked.




Archives