Link: http://wirehopper.com/design/banner.php

The link above allows you to upload images, which can be compiled into a banner. The banner can then be run through robots-design. That will extract the colors and apply them to the CSS.

Link: http://colorschemedesigner.com/

How colors fit together is an art, and a science. The link above has a great tool that creates color schemes.

It has an export capability that allows you to get the colors it generates. Click on “scheme info". If you click on ‘View Source’ (as the page tells you), it has a nice little segment with the CSS colors all set.

These colors are from this scheme: http://colorschemedesigner.com/#4-51WVZrG4mGu

.primary-1 { background-color: #10062E }
.primary-2 { background-color: #110C22 }
.primary-3 { background-color: #09021E }
.primary-4 { background-color: #4C3596 }
.primary-5 { background-color: #604F96 }

.secondary-a-1 { background-color: #1E032D }
.secondary-a-2 { background-color: #190A21 }
.secondary-a-3 { background-color: #13011D }
.secondary-a-4 { background-color: #712E96 }
.secondary-a-5 { background-color: #7B4A96 }

.secondary-b-1 { background-color: #06112D }
.secondary-b-2 { background-color: #0C1222 }
.secondary-b-3 { background-color: #020A1D }
.secondary-b-4 { background-color: #345196 }
.secondary-b-5 { background-color: #4E6496 }

I pasted them into robots.design, as displayed, and got an interesting page.

This is definitely a case where tuning the design colors and those submitted to a better match would be effective.

A side by side demo can be seen at: http://robots-wizard.com/robots.design/notes/iframe.htm

Theoretically, you could create a greyscale site template and apply nice colors from the ColorSchemeDesigner site - and customize a site very quickly.

I’m offering you an idea for a product. The implementation may be of less value to you than the underlying concept. There are several factors that make this a potentially valuable idea:

* Web sites and applications are becoming exponentially more complex.

* Cost-effective integration of multiple applications into sites is becoming more important.

* Site visitor expectations are becoming higher and higher.

* CSS allows almost complete dissociation of design and content.

The basic idea is to allow a person to submit an image and have the colors extracted from the image and substituted into a CSS file, thereby recoloring the site. If you have a site that integrates several applications, recoloring them with a consistent process can greatly reduce the cost of design updates and make application management (especially upgrades) much easier.

I developed a simple utility (robots.design) which will accept an image and the color attributes from CSS files, then create Linux sed commands that can be used to substitute the image colors into the CSS. I don’t think it is viable as a product in its current state, because the skill set required to take advantage of it spans too much of the web professional spectrum (most designers don’t use the Linux command line). A graceful interface or integration into one of your products may enhance DreamWeaver or other CreativeSuite products.

I didn’t invest alot of time in the tool, I built it for myself because I had to maintain code that had a difficult architecture and this solution allowed me to recolor the interface very efficiently. I still use it.

It is listed at HotScripts (http://www.hotscripts.com/Detailed/80489.html)

The software itself is probably of little value, and the processing is done on the server-side. Adobe has powerful image processing libraries that would eliminate the need for ImageMagick and the other open source components I used. I envision an option that would allow a designer to select a comp and indicate which CSS files should be updated with the colors.

Key considerations:

* Many applications break the CSS into several files, placing colors in one file. In that case, only that file needs to be processed.

* Sometimes, there are colors which you don’t want changed. A good example is error and warnings - which should stand out.

* Old sites which may have inline styles can be updated with this tool as well.

http://robots-wizard.com/robots.design/

If you have experience with DreamWeaver extensions, this may be a great contribution to the product. I don’t have the time to build a DreamWeaver extension, and I don’t need to - robots.design does exactly what I want it to.

This post has not been endorsed by Adobe. All trademarks are property of their respective holders.

robots.design works very well through upgrades, in this case, with dojo. Using the tundra theme, I can reskin an application - including dojo/dijit very quickly.

Some colors should not be changed - specifically error and warning displays which are traditionally red and yellow respectively. A backup of the CSS files was invaluable, since a dojo upgrade only required CSS upgrades for the dojo files (dojo.css, dijit.css, tundra.css).

Link: http://know-waste.com/2008/11/25/adn-application-delivery-network

The link above suggests integrating diverse, externally hosted applications with polished designs. This is an excellent use of robots.design, because the volume of design translation may be massive.

The basic approach would be to identify those CSS files related to color, get the color attributes, and apply new colors using robots.wizard. You could skin many applications, very quickly, even if their original color schemes were very different.

The key to success will be to limit the skin colors, and augment them with images. If you have a very complex, colorful, comp, the variation in target application color schemes may make it difficult to get a consistent color set out of robots.wizard. You can remove colors from the image, without modifying it, in Step 1 of robots.wizard.