Button

A Button indicates a possible user action.

Button

A standard button.

You can do the same using shorthands.

Emphasis

A button can be formatted to show different levels of emphasis.

You can do the same using shorthands.

Animated

Buttons can animate to show additional or hidden content.

Labeled

A button can be accompanied by a label.

You can do the same using shorthands.

You can do the same using shorthands.

Icon

A button can be made of only an icon.

You can do the same using shorthands.

Labeled Icon

A button can use an icon as a label.

You can do the same using shorthands.

Basic

The basic button has a subtle appearance.

You can do the same using shorthands.

Inverted

A button can be formatted to appear on a dark background.

Group

Buttons can exist together as a group.

You can do the same using shorthands.

Icon Group

Button groups can show groups of icons.

You can do the same using shorthands.

Conditionals

Button groups can contain conditionals.

Active

A button can show it is currently the active user selection.

Disabled

A button can show it is currently unable to be interacted with.

Loading

A button can show a loading indicator.

Social

A button can be formatted to link to a social website.

Size

Buttons can have assorted sizes.

Floated

A button can be aligned to the left or right of its container.

Colored

A button can have different containers.

Compact

Buttons can have reduced padding.

Toggle

A button can be formatted to toggle when active.

Positive

A button can hint towards a positive consequence.

Negative

A button can hint towards a negative consequence.

Fluid

A button can take the width of its container.

Circular

A button can be circular.

Vertically Attached

A button can be attached to the top or bottom of other content.

Horizontally Attached

A button can be attached to the left or right of other content.

Floated Group

Groups can be aligned to the left or right of its container.

Vertical Group

Groups can be formatted to appear vertically.

Icon Group

Groups can be formatted as icons.

Using shorthand icons formats each individual button as an icon button.

Labeled Icon Groups

Groups can be formatted as labeled icons.

Mixed Group

Groups can be formatted to use multiple button types together.

Equal Width

Groups can have their widths divided evenly.

Colored Group

Groups can have a shared color.

Basic Group

A button group can be less pronounced.

Group Sizes

Groups can have a shared size.

Focus

A button can be focused.

Attached events

A button can be handle all events.