OK, well I'll start it off then.
Northern Lights
Living in Alaska and all, it seemed appropriate, and its a button style I made for a site Im currently working on.
Here is the CSS
.northernLights {
background-image: -moz-linear-gradient(top, #83B97D, #1E293F);
background-image: -o-linear-gradient(top, #83B97D, #1E293F);
background-image: -webkit-linear-gradient(#83B97D, #1E293F);
background-image: -webkit-gradient(linear,left top, left bottom, color-stop(0, #83B97D), color-stop(1, #1E293F));
background-image: linear-gradient(top, #83B97D, #1E293F);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#83B97D', EndColorStr='#1E293F', GradientType=0);
color: #FFFFFF;
font-weight: bold;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border: 1px solid #FFFFFF;
padding: 5px;
cursor: pointer;
}
.northernLights:hover {
border: 2px solid #FFFFFF;
padding: 4px;
}
The screen shot is the up state., on a dark background. On over , the border just gets a little bigger.
Anyway, I dont know about the 'best button ever' But it is a nice looking button that fits very well in this site, and just changing the start and end colors of the gradient could make it work in a lot of situations.
Thanks!
Tom