Générateur de boutons CSS
Concevez des boutons et copiez un CSS propre.
Définissez le texte, les couleurs, le rayon, le padding et la taille de police d'un bouton, prévisualisez-le en direct, puis copiez un CSS prêt à l'emploi avec état survol.
Fond
Couleur du texte
Couleur au survol
12px
24px
12px
16px
.my-button {
background: #7c3aed;
color: #ffffff;
border: none;
border-radius: 12px;
padding: 12px 24px;
font-size: 16px;
font-weight: 700;
cursor: pointer;
transition: background 0.2s ease;
}
.my-button:hover {
background: #6d28d9;
}Comment générer du CSS de bouton
- Saisissez le texte du bouton souhaité.
- Choisissez les couleurs de fond, de texte et de survol.
- Ajustez rayon, padding et taille de police avec les curseurs.
- Copiez le CSS et ajoutez la règle de survol à votre feuille de styles.
Questions fréquentes
Le CSS inclut-il l'effet de survol ?
Oui. Une règle :hover avec votre couleur de survol est générée avec le style de base.
Puis-je changer la police ou la graisse ?
La sortie définit font-weight 700. Modifiez font-family et autres propriétés librement après le collage.
Quelque chose est-il envoyé ?
Non. Le générateur est entièrement côté client et ne stocke rien.