Buttons
Buttons are essential web elements for interaction.
Code
Types
There are 3 different types of button.
- .btn--flat
- .btn--float
- .btn--raised
Colors
By default, the flat and the raised buttons are the $primary variable color and the floating button is the $accent variable. If you want a specific color, there are 7 different colors.
- .btn--red
- .btn--yellow
- .btn--green
- .btn--blue
- .btn--primary
- .btn--secondary
- .btn--accent
<button class="btn--flat">Flat</button>
<button class="btn--float">+</button>
<button class="btn--raised">Raised</button>
<button class="btn--raised btn--green">Green</button>
<button class="btn--raised btn--blue">Blue</button>
<button class="btn--raised btn--accent">Accent</button>