Icon button component

An icon button is a small clickable image that represents a command in a symbolic manner.   

Example of icon buttons

Behavior

General

By clicking on an icon button, users can perform the corresponding action.

To make them easy to use, a tooltip with more information can be used when hover.

Icon button in pane header

To add action related to controlling the pane, one or more icon button can be placed on the right side of the pane header.

Style

Color

By default, button icons shall be grey with 62% opacity.

Size

Button icons shall be provided in 14x14px PNG and in a scalable vector file for all larger sizes than 14×14.