Important Links

Get Started

Components

Avatar Alert Badge Button Cards Image Input Texts Utilites List Navigation Rating Snackbar Grid Modal

Home Components Button

Button

The Button component is used to trigger an action or event, such as submitting a form, opening a dialog, canceling an action, or performing a delete operation.

Usages

To achieve the above buttons, you need to follow the following code:

                
                  < -- For Default Button -->
                  

                  <button class="btn">Button</button>
                  

                  

                  < -- For Primary Button -->
                  

                  <button class="btn btn-primary">Button</button>
                  

                  

                  < -- For Secondary Button -->
                  

                  <button class="btn btn-secondary">Button</button>

Button with link

Button with link is used to link from one page to another.

Usages

To achieve the above buttons, you need to follow the following code:

                
                  < -- For Link Button -->
                  

                  <button class="btn btn-link"><a href="">Button</a></button>

Button with icon

You can use Icons in your Buttons respectively.

Usages

To achieve the above buttons, you need to follow the following code:

                
                  < -- For Default Icon Button -->
                  

                  <button class="btn btn-icon"><svg>Button<svg></button>

Floating Action Button

You can use Icons in your Buttons respectively.

Usages

To achieve the above buttons, you need to follow the following code:

                
                  < -- For Floating Action Button -->
                  

                  <button class="action-button"><svg>+<svg></button>

Badge

Cards