Overview

Buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways.

Edit this section, Opens in new window

Usage

The Icon Button is used when you want small button controls.

Edit this section, Opens in new window

Behaviours

Interactions

Active

Hovered

Focused

Hover + focus

Modifiers

Disabled

NOTE! For disabled styling of icon buttons, it is up to the developer to add the required styling. We cannot support 100s of disabled icon buttons from the design system directly. See the Icon component for examples on how to solve this.

<button class="if icon-button icon ui trashcan disabled" disabled></button>
Edit this section, Opens in new window

Anatomy

Icon button
  1. Control
Edit this section, Opens in new window

Specs

Icon button
  1. Control
Edit this section, Opens in new window
Contact us, Opens in new window