Nice Button

dabblet.css

/**
 * Nice Button
 */

button {
border: 1px solid #000;
margin: 0;
outline: 0;
padding: 10px 30px;
color: rgba(255,255,255,0.9);
font-weight: bold;
font-family: 'Open Sans';
border-radius: 3px;
text-shadow: 0 1px 0 rgba(0,0,0,0.8);
box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
background: linear-gradient(top,  #444444 0%,#333333 100%);
}

button:hover {
color: rgba(255,255,255,1);
background: linear-gradient(top,  #555 0%,#444 100%);
}

button:active {
color: rgba(255,255,255,0.8);
box-shadow: inset 0 -1px 0 rgba(255,255,255,0.3);
background: linear-gradient(top,  #333 0%,#444 100%);
}

dabblet.html

<button>Click This Button</button>

settings.json

{"view":"split","fontsize":"70","seethrough":"","prefixfree":"1","page":"css"}