ReInventing the (color) wheel
-
There must be hundreds of (much better) tools like this but I’ve been playing with / developing a design exploration script the last two days based around dynamically altering color schemes in CSS and WP. Bear in mind I am totally new to both and my scripting skills are not too flash either but anyway… it’s a fun tool to play with. It could easily be adapted further, like separating controls for backgrounds versus text, using a form to point to the file you want to test, direct color controls etc. It only works on the target page so don’t try the links.
color wheel tool demo
(yes I know it’s ugly – from that point any change looks good lol)
While the script pulls the index.php and the target.css from elsewhere it never alters them but creates it’s own copies. There’s two possible ways of using the tool. First, as is, for color exploration ending up with saving the final css. The other way would be to integrate it with a WP blog (or anything else that uses CSS) so that users can play with it and save a particular config themselves – in fact probably could be done with a cookie since there are really not that many variables.
My interpretation of some of the functions (eg hue) is rough and ready but they do allow you to work your way through almost any color combination. The “reset” checkbox takes you back to the start. The GS-mask selects only those colors that are greyscale and applies any other selected changes to those (eg tick GS checkbox and then try lightness +30%) – the dmask selects colors darker than the mid point, the lmask selects those which are lighter than average.
I’ve found it an interesting way to explore color design – lots of suprising outcomes, especially using the hue and invert controls. If anyone else finds it fun / useful I can tidy up the code.
andrew
- The topic ‘ReInventing the (color) wheel’ is closed to new replies.