Categories Site Actions X

A Nice Looking CSS3 button

Posted on Saturday, December 24th, 2011 in Uncategorized by Nick

Originally I was going to write another post on creating a simple CSS3 button. After a few failed attempts at writing it, I figured a post with just the code and some gradients will do the same job.

Code:

#stlye{ padding:10px 50px; background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#e26363), to(#a73131));  -webkit-border-radius:5px; border-radius: 5px; text-shadow: -1px 1px 0px rgba(51, 51, 51, 1); text-decoration:none; color:#FFF; box-shadow:0px 2px 0px #000000; font-family:Tahoma; }

Sorry for the sloppy formatting of the code… The blog’s syntax plugin sucks.

Gradients:

Red -> #e26363 and #a73131
Blue -> #638be2 and #314fa7
Green -> #63e27e and #3fa731
Purple -> #d165e4 and #9a31a7

Preview:

Leave a Reply

Join the forum to add your own thoughts!