Button Stable Updated

Buttons attract users’ attention for actions. Different hierarchy levels of buttons are used to achieve the desired loudness level of attraction.

Standard button

<button class="button ">Button</button>
<button class="button icon-plus">Button</button>

Control button

<button class="button button--control icon-arrow-up-large">Up</button>

Text button

<button class="button button--link icon-link-intern">Button</button>

Small button

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

Primary button

<button class="button button--primary">Button</button>
<button class="button button--primary icon-plus">Button</button>

Button Group

<div class="button-group">
  <button class="button icon-download">Download</button>
  <button class="button ">Button</button>
  <button class="button button--primary">Submit</button>
</div>