Overview

Use KIconButton in situations where larger buttons with visible text would hinder the user experience. Use the flat secondary style unless the action should be highlighted.

A tooltip with the name of the action is required for an icon button.

Related

Props

Name Description Type Default Required
icon
Name of icon to display
string true
appearance
Button appearance: 'raised-button' or 'flat-button'
string 'flat-button'
color
Optional hex or rgb[a] color for the button background
string null
disabled
Whether or not button is disabled
boolean false
buttonType
HTML button type attribute (e.g. 'submit', 'reset')
string 'button'
size
Button size: 'mini', 'small', 'regular', or 'large'
string 'regular'
ariaLabel
aria-label attribute
string null
tooltip
Tooltip label
string null
tooltipPosition
Tooltip position: 'top', 'right', 'bottom', 'left'
string 'bottom'

Slots

Name Description
menu
Pass sub-components into the button, typically KDropdownMenu