Auf webdesignerwall.com wurde vor geraumer Zeit ein Artikel über CSS3 Buttons veröffentlicht.
Das tolle bei diesen Buttons ist, dass mit dieser CSS3 Technik sehr schöne plastische Buttons komplett ohne Grafiken erstellt werden können.

Features:

• Buttons ohne Grafiken, reines CSS(!)
• Linearer zweifarbiger Verlauf
• Textschatten
• Objektschatten
• Abgerundete Ecken (Vielleicht im IE9 dann )
• Diverse Grössen
• Der Button-Style ist auf alle Elemente Anwendbar
  (Crossbrowsertauglich vorausgesetzt der Doctype stimmt )
• Fallback-Style für ältere Browser welche die oben genannten Features nicht unterstützen
• Drei Stadien definerbar: Normal, Hover und Active
• Einfache Implementation

Hier der CSS-Code für die oben platzierten Coffee Buttons:

.button {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	margin: 0 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: .5em 2em .55em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
	text-decoration: none;
}
.button:active {
	position: relative;
	top: 1px;
}
.bigrounded {
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;
}
.medium {
	font-size: 12px;
	padding: .4em 1.5em .42em;
}
.small {
	font-size: 11px;
	padding: .2em 1em .275em;
}
.coffee {
	color: white;
	border: solid 1px #3d1800;
	background: #3d1800;
	background: -webkit-gradient(linear, left top, left bottom, from(#3d1800), to(#6f3c1b));
	background: -moz-linear-gradient(top,  #3d1800,  #6f3c1b);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d1800', endColorstr='#6f3c1b');
}
.coffee:hover {
	background: #633518;
	color: white;
	background: -webkit-gradient(linear, left top, left bottom, from(#633518), to(#91532a));
	background: -moz-linear-gradient(top,  #633518,  #91532a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#633518', endColorstr='#91532a');
}
.coffee:active {
	color: white;
	background: -webkit-gradient(linear, left top, left bottom, from(#633518), to(#91532a));
	background: -moz-linear-gradient(top,  #633518,  #91532a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#633518', endColorstr='#91532a');
}

Der Button-Code könnte so aussehnen:

<div class="button coffee">Div</div>
oder
<input class="button coffee" value="Input Element" type="button"/>

Quellen:

webdesignerwall.com