Default button

Default light button example

Default with icon

Available in both directions

Default with menu

Default button with dropdown

Colored button

Default 8 contextual colors

Colored with icon

Available in both directions

Colored with menu

Colored button with dropdown

Rounded button

Works with all button types

Rounded with icon

Available in both directions

Rounded with menu

Rounded button with dropdown

Labeled button

Works with all button colors

Rounded with label

Available in both directions

Labeled with menu

Labeled button with dropdown

Linked button

Transparent button example

Linked with icon

Available in both directions

Linked with menu

Linked button with dropdown

Default colors

Default 8 contextual colors

Default colors with icon

Available in both directions

Default colors with menu

Outline button with dropdown

Custom colors

Available in all custom colors

Custom colors with icon

Available in both directions

Custom colors with menu

Outline button with dropdown

Transparent border

Using .border-transparent class

Thin border

Default 1px border width

Thick border

Using .border-2 class

Transparent border

Default option without border color

Alpha with border

Both thin and thick borders

Alpha static

No hover/active state changes

Single icon button

Button with a single icon only

Rounded icon button

Works with all button types

Icon with menu

Icon button with dropdown

Single icon button

Button with a single icon only

Rounded icon button

Works with all button types

Icon with menu

Icon button with dropdown

Floating button

Floating action button example

Floating with text

Float buttons with text and icons

Rounded floating buttons

Rounded floating buttons with icons

Default button sizes

Available sizes of default buttons

Large size

Default size

Small size

Labeled button sizes

Available sizes of labeled buttons

Large size

Default size

Small size

Outline button sizes

Available sizes of outline buttons

Large size

Default size

Small size

Left icon position

Display icon on the left side

Right icon position

Display icon on the right side

Right in dropdown

Additional option for right icon

Left label position

Display label on the left side

Right label position

Display label on the right side

Right in dropdown

Additional option for right label

Custom brown color

Custom color from brown palette

Custom pink color

Custom color from pink palette

Custom teal color

Custom color from teal palette

Button dropdown

Basic button dropdown example

Menu with icon

Dropdown button with icon

Segmented button

Segmented button dropdown

Button dropup

Basic button dropup example

Drop right

Right aligned dropdown menu

Drop left

Left aligned dropdown menu

Rounded button dropup

Dropup attached to rounded button

Rounded button menu

Rouned button menu with icon

Rounded segmented

Rounded button with segments

Labeled button dropup

Dropup attached to labeled button

Labeled segment

Segmented labeled button

Segmented dropup

Labeled button dropup

Icon button dropup

Dropup attached to icon button

Segmented dropdown icon

Dropdown in segmented icon button

Segmented dropup button

Dropup in segmented icon button

Loading button

Custom loading state

Radio button group

Bootstrap radio button group

Justified link group

Justified links in button group

Button group

Group of buttons in btn-group

Single toggle button

Using data-toggle="button"

Button group nesting

Example of nested button groups

Button toolbar

Complex btn-group components

Checkbox button group

Bootstrap checkbox button group

Justified button group

Justified buttons in button group

Expand Left

Spinner appears on left

Expand Right

Spinner appears on right

Expand Up

Spinner appears on top

Expand Down

Spinner appears on bottom

Slide Left

Spinner slides from right

Slide Right

Spinner slides from left

Slide Up

Spinner slides from bottom

Slide Down

Spinner slides from top

Zoom In

Spinner appears after zoom in

Zoom Out

Spinner appears after zoom out

Fixed Position

Spinner appears instead of text

Border radius

Border radius animation