Generador de Button en CSS3

Your browser does not support the CSS3 box-shadow property. You can still use this tool to generate the CSS3 rule, but you won't be able to see the results.

Clik me

1. Base Settings

Texto:

Font size: px

Padding: px

Radius: px

Text Colour:

2. Background

3. Drop Shadow

4. Text Shadow

HTML

<a href="#" class="button">Lo quiero</a>

CSS

color: rgb(0, 255, 0);
font-size: 16px;
padding: 7px;
text-shadow: 4px 3px 2px rgba(30, 30, 30, 0.57);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: rgb(210, 235, 242);
background: -moz-linear-gradient(270deg, rgb(210, 235, 242) 17%, rgb(255, 20, 20) 65%);
background: -webkit-linear-gradient(270deg, rgb(210, 235, 242) 17%, rgb(255, 20, 20) 65%);
background: -o-linear-gradient(270deg, rgb(210, 235, 242) 17%, rgb(255, 20, 20) 65%);
background: -ms-linear-gradient(270deg, rgb(210, 235, 242) 17%, rgb(255, 20, 20) 65%);
background: linear-gradient(180deg, rgb(210, 235, 242) 17%, rgb(255, 20, 20) 65%);
-webkit-box-shadow: 10px 9px 15px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    10px 9px 15px rgba(50, 50, 50, 0.75);
box-shadow:         10px 9px 15px rgba(50, 50, 50, 0.75);

Cómo utilizar el Generador de Button

Este generador de CSS3 botón le permite crear rápidamente botones para su sitio web utilizando sólo HTML y CSS!

Utilice los cuatro paneles de control para sintonizar finamente el estilo del botón. Una vez que haya terminado, copia y pegar el código generado directamente en su proyecto.