Buttons

  1. Elements
  2. Buttons
Theme Buttons

Predefined button styles, each serving its own semantic purpose.

Class Reference Values
class="btn ripple btn-main-[value]" primary | secondary | light | dark
Bootstrap Buttons

Predefined button styles, each serving its own semantic purpose.

Class Reference Values
class="btn ripple btn-[value]" primary | secondary | success | warning | danger | info | light | dark
Bootstrap Disabled Buttons

Predefined button styles, each serving its own semantic purpose.

Outline Buttons

Predefined button styles, each serving its own semantic purpose.

Class Reference Values
class="btn ripple btn-outline-[value]" indigo | primary | secondary | success | warning | danger | info | light | dark
Rounded Buttons

Predefined button styles, each serving its own semantic purpose.

Rounded Outline Buttons

Predefined button styles, each serving its own semantic purpose.

Button Sizes

Fancy larger or smaller buttons? Add .btn-lg or .btn-sm and .btn-blockfor additional sizes.

Button with Icons

A basic button with added icons.

Button Groups

Group a series of buttons together on a single line with the button group.

Icon Buttons

A button variant for using only icons.

Project Status
1
Project Planning
100% Completed
1
Project Desiging
100% Completed
4/6
Project Development
76% Progress
1/5
Project Testing
Waiting
View More