Sommaire

La couleur des boutons

Foundation vous propose plusieurs couleurs de bouton à appliquer selon vos contextes d’utilisation. Voici les classes utilisables :

  • .secondary : couleur grise (background: #777;),

  • .success : couleur verte (background: #3adb76;),

  • .alert : couleur rouge (background: #ec5840;),

  • .warning : couleur orange (background: #ffae00;),

  • .disabled : couleur bleu très clair (opacity: 0.25;), avec la désactivation du bouton, sans le curseur en forme de main.

Le fichier de cet exemple à télécharger est Chapitre 08 / 08-bouton-d.html.

Notez bien qu’il y a à nouveau un effet de transition, avec une teinte plus sombre au survol et à la sortie du curseur au-dessus des boutons.