Skip to content

Icon Button13.10.5

Bundle


$ npm i @if-design-system/Icon button@13.10.5

Edit this section

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

Usage

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

Edit this section

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

Anatomy

Icon button
  1. Control
Edit this section

Specs

Icon button
  1. Control
Edit this section

Implementation

<button type="button" class="if icon-button icon ui trashcan" aria-label="Delete"></button>
Edit this section

Contact us