Portable CSS3 Button Generator

Generate CSS

Top Gradient Color

Middle Gradient Color

Bottom Gradient Color

Border Color

Text Color

Shadow Color

Hover Top Gradient Color

Hover Middle Gradient Color

Hover Bottom Gradient Color

Hover Border Color

Hover Text Color

Variable Size More Options Advanced Dark Background Change Class: How to Use

Font Size:

Padding:

Border Width:

Border Radius:

Shadow Offset-X:

Shadow Offset-Y:

Shadow Blur:

Font Family:
Font Weight:
Border Style:
Box Shadow:
Text Dimension:

Letterpress dimensional option will looks good only when combined with the text color that darker than the the button background color.

Default Behaviour Color Stop

Hover Color Stop

Custom Gradient Orientation

Top
Right
Bottom
Left
Custom Orientation

Portable CSS3 Button Generator :: About Second Revision

Do whatever you can do on this tool. Click on the "Generate CSS" button to get the CSS Code. Put on your template stylesheet. Calling the CSS can be done by writing the HTML code wherever you want like this:

<a class="button" href="#">Button Name</a>

or like this:

<button class="button">Button Name</button>

or like this:

<span class="button">Button Name</span>

or like this:

<input type="button" class="button" value="Button Name" />