Free Online Design Tools and Resources for Programmers

I’m a programmer. At least I want to be. But the reality of web development requires wearing multiple hats. This includes from time to time, working on design. After all what is a web app if it is poorly designed? Both UI and aesthetics are important from customer/user perspective.

Fortunately, there are many great designers who are also developers (or who have developer friends) and they release cool tools to help out. So here is a list of resources I’ve found useful when wearing the designer hat.

http://0to255.com/ – when working with color
http://framebox.org/ – rapid prototyping and sharing

http://subtlepatterns.com/ – spice up the background with some subtle patterns

http://www.html-ipsum.com/ – lorem ipsum text wrapped in different html elements

http://placehold.it/ – placeholder image spaces
http://flickholdr.com/ – placeholder images from flickr
http://placekitten.com/ – turns any project into a success

http://www.copypastecharacter.com/ – copy and paste special characters/lookup
http://www.cssbuttongenerator.com/ – make nice css buttons
http://www.colorzilla.com/gradient-editor/ – css gradients
http://www.red-root.com/sandbox/holmes/ – clean up, css debugger
http://gridulator.com/ - make a grid layout

http://warpspire.com/talks/designhacks/ Not necessarily a tool, but a great presentation on design geared at developers