I’m a web developer, and have a sort of “Photoshop-phobia”. I’m great at coding with CSS/XHTML, but I can’t stand going into Photoshop or another photo editor to create background images for my sites. After a while, I realized that there isn’t much you can do with a bunch of one-color boxes. But, there is a solution: Gradients. Gradients get rid of that boring, one coloredness in your web pages, and instead have a transition from one color to another. The greatest part is that there is a way to create them without any apps. The interface looks like this:
So, when is an app not an app?
Is a web app not an app?
It would take you 10 minutes to learn most of what can be done with the Photoshop gradient tools, and that would give you about 100x the power of this web app, as good as it is…
u should try -moz-border-colors… work only @mozilla products but looks nice (if u need gradient at border;)
@Alex: I don’t see the point in not-using-the-evil-photoshop. I’m webdevloper also and I can’t stand webdesigning without it.
Kent, do we really need to analyze every word here? kameowy, thanks for the tip, and riddle I dont think photoshop is evil ok, it’s a powerful tool. Personally, I prefer sticking to coding as much as possible. That’s all I was saying.
For background gradients, it’s common practice to get a 1px wide (or tall) sample and
background-repeat: repeat-x (or y)
to reduce bloat. For patterns like the one on the title bar here, a small block of sample is taken and repeated. This would be a more useful tool if it gave you the sample instead of the whole image.
(I haven’t made a web page in years, but I think they still do it like this)
Something I was playing around with the other week:
http://slayeroffice.com/code/gradient/
Cross-browser, no images. Just define the gradient colors as part of the class attribute. Could probably do with some refining, and requires the element to be positioned for it to work, but its pretty quick.
Great! goodluck
Anything that avoids massive background pictures is good, imo