CSS gradient background

Nice tool to make your life longer.

Today I needed to make some text inputs with gradient background and of course I didn't remember which lines to write in the CSS file.

So I went to my favourite searcher Google to see how to make gradient backgrounds with CSS and the first option was this tool I came up with. It just gave me all the code I needed, instead to explain me how to make it. It wasn't what I was specting but even better.

Here are some screenshots of that web application:

Screenshot CSS gradient tool

CSS tool screenshot

The tool itself is very easy. I just setup the start color and the end color, select the desired direcction and then I only needed to copy the generated CSS markup at the end of the page. And of course paste the code in the correct class in my CSS file.

It generates crossbrowser CSS gradient backgrounds. :)


And here is the result:

Resultant effect

This project has been designed by Nomad Estudio.


What was my surprise when I went to see who is the author of this nice and free tool (cos maybe it would be some genius guy who likes open source...) and I discovered that it was located in microsoft.com!! O_o

So here is the link:


Enjoy it!

Wed, Aug 22nd 2012, 20:05 | CSS, Projects, Tricks


Add New Comment

Your name:
Your e-mail:
Your web page:
I would like to receive new comment notification.
Security code: