CSS3 Button Maker es una Herramienta para crear estilos de botones con CSS3 Online. Te permite crear los estilos necesarios para crear un botón para tu aplicación. Por medio de una serie de barras deslizantes y varias opciones más, podrás indicar el tamaño del botón, si quieres esquinas redondeadas, color del fondo, el tipo de gradiente y mas opciones.
Luego con pulsar el botón, nos ofrecen el código que podremos copiar para utilizarlo sin problemas, ejemplo:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
.button { border-top: 1px solid #fc4f29; background: #54271d; background: -webkit-gradient(linear, left top, left bottom, from(#f85e37), to(#54271d)); background: -webkit-linear-gradient(top, #f85e37, #54271d); background: -moz-linear-gradient(top, #f85e37, #54271d); background: -ms-linear-gradient(top, #f85e37, #54271d); background: -o-linear-gradient(top, #f85e37, #54271d); padding: 16px 32px; -webkit-border-radius: 17px; -moz-border-radius: 17px; border-radius: 17px; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0; -moz-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0; text-shadow: rgba(0,0,0,.4) 0 1px 0; color: white; font-size: 24px; font-family: Helvetica, Arial, Sans-Serif; text-decoration: none; vertical-align: middle; } .button:hover { border-top-color: #ed5634; background: #ed5634; color: #ccc; } .button:active { border-top-color: #4f2016; background: #4f2016; } |
Visita el sitio desde Aquí
