Variants

Use variant to change the button style: default, primary, success, neutral, warning, danger, text.

Default Primary Success Neutral Warning Danger Text

Outline

Add the outline attribute for outline-style buttons.

Default Primary Success Neutral Warning Danger

Sizes

Three sizes: small, medium (default), large.

Small Medium Large

Pill

Add pill for fully rounded edges.

Small Pill Medium Pill Large Pill

Circle

Add circle with an icon for a circular icon button.

Loading

Add loading to show a spinner while an action is in progress.

Loading Processing Deleting

Disabled

Add disabled to prevent interaction.

Default Primary Success Outline

Prefix & Suffix Icons

Use slot="prefix" and slot="suffix" to add icons.

Download Settings Confirm

Caret

Add caret to indicate a dropdown trigger.

Options Actions

Link Buttons

When href is set, the button renders as an <a> element.

Visit Example.com Back to Home