Skip to content

Instantly share code, notes, and snippets.

@lastguest
Created April 24, 2012 12:04
Show Gist options
  • Save lastguest/2479123 to your computer and use it in GitHub Desktop.
Save lastguest/2479123 to your computer and use it in GitHub Desktop.
Plastic CSS button
/* Plastic CSS button */
body {
background-color: #cececa;
}
.button>span {
display: inline-block;
width: auto;
padding: 0.5em;
background-color: #71899a;
background-image: linear-gradient(top, #97b4a2, #4c5e92);
border-radius: 1.6em;
color: #fff;
font: bold 1em/1.1em Helvetica,Arial;
text-shadow: 0px -1px 1px rgba(0,0,0,.35);
box-shadow: 0px 1px 2px rgba(0,0,0,.75);
}
.button {
display: inline-block;
padding: 0.35em;
border-radius: 2em;
background-image: linear-gradient(top, rgba(0, 0, 0, .50), rgba(255, 255, 255, 0.50));
}
<!-- content to be placed inside <body>…</body> -->
<div class="button"><span>Caffeina</span></div>
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment