Toggleable Button

Updated on Nov 11, 2026

A toggleable Button lets users switch between selected and unselected states. To make a Button toggleable, set the togglable prop to true. The prop defaults to false.

The selected prop sets the selected state. To control it from component state, update the value in the @click handler:

vue

<Button :togglable="true" :selected="selected" @click="selected = !selected">
    Toggle
</Button>

The following example demonstrates toggleable Buttons in different fill modes.

Example

View Source

Loading ...

Suggested Links

• API Reference of the Button
• Disabled Button
• Icon Options
• Appearance