Generador de botones CSS

Diseña un botón con texto legible y copia el CSS.

En tu dispositivo · Sin cuenta

Generador de botones CSS procesa lo que introduces en este navegador. Los datos introducidos y los resultados se excluyen de las estadísticas de uso. Las herramientas recientes guardan sus nombres, el número de visitas y la fecha y hora de la última visita. Las herramientas guardadas solo almacenan sus nombres. Guardar borradores es opcional y el texto permanece en este dispositivo; puedes eliminarlo con los controles del borrador. Cargar texto desde una URL es opcional y establece una conexión con ese servidor; el servidor puede ver la URL y tu dirección IP. La opción «Usar en» conserva temporalmente los datos en esta pestaña para pasarlos a otra herramienta. La siguiente herramienta los elimina al abrirse y los ignora si ha pasado más de un minuto.

«Copiar enlace» incluye en la dirección los datos que elijas compartir. Cualquiera que tenga el enlace puede volver a abrirlos. Se excluyen los archivos y los resultados generados. Las herramientas de contraseñas y claves solo comparten los ajustes.

Más opciones

Tu resultado

 

Más
Atajos de teclado

Sobre los enlaces y el reinicio

Los enlaces incluyen los datos que introduces y la configuración. Cualquiera que tenga el enlace puede verlos, así que no incluyas texto privado. Los archivos y los resultados generados no se incluyen; las selecciones aleatorias se repiten.

Al restablecer, la herramienta se recarga con sus valores iniciales y libera los archivos abiertos y los controles de dispositivos. Los borradores guardados permanecen en este dispositivo hasta que los elimines.

Cómo funciona

El generador de botones CSS muestra las declaraciones y una vista previa en el navegador que se actualiza al hacer cambios. Ajusta cada valor y copia el CSS en tu propio selector.

Siguiente: Generador de sombras CSS

Ejemplo

El ejemplo crea un botón «Continuar» con esquinas redondeadas y un borde visible.

Antes de usar el resultado

La herramienta define el estilo del botón; no añade un destino ni una acción. Comprueba el contraste y el foco del teclado en la página donde lo uses.

Citar esta página

ToolOctopus. “Generador de botones CSS.” Actualizado 7 de octubre de 2026. https://tooloctopus.com/es/generador-de-botones-css.

Añade la fecha de consulta si tus instrucciones lo requieren.

Las citas se formatean con citeproc-js, de Frank Bennett, y estilos de Citation Style Language. Licencia y código fuente.

Buscar una herramienta

Type a task, a unit pair, a sum or a time zone. ↓ to choose, Enter to open.