Button

Button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.

To see all the colors and their variations go to the Styleguide page

Default

To change color just use 'button-' + color class, like button-squid or button-aqua

<button class="button button-squid">
  Button
</button>

Rounded

Style with border rounded, just add the class .rounded

<button class="button button-squid rounded">
  Button
</button>

Inverted

Just add inverted class

<button class="button inverted button-squid">
  Button
</button>

Disabled

Just add disabled class

<button class="button button-squid disabled">
  Button
</button>

Sizes

Buttons has sizes class

To use the medium size button, just don't add any size class

.button-sm
.button-lg
.button-xl