Buttons

Basic Buttons
Show Code
                    
        <button class="btn btn-primary w-7r mb-1">Primary</button>
        <button class="btn btn-secondary w-7r mb-1">Secondary</button>
        <button class="btn btn-success w-7r mb-1">Success</button>
        <button class="btn btn-danger w-7r mb-1">Danger</button>
        <button class="btn btn-warning w-7r mb-1">Warning</button>
        <button class="btn btn-info w-7r mb-1">Info</button>
        <button class="btn btn-light w-7r mb-1">Light</button>
        <button class="btn btn-dark w-7r mb-1">Dark</button>
                    
                  
Outline Buttons
Show Code
                    
        <button class="btn btn-outline-primary w-7r mb-1">Primary</button>
        <button class="btn btn-outline-secondary w-7r mb-1">Secondary</button>
        <button class="btn btn-outline-success w-7r mb-1">Success</button>
        <button class="btn btn-outline-danger w-7r mb-1">Danger</button>
        <button class="btn btn-outline-warning w-7r mb-1">Warning</button>
        <button class="btn btn-outline-info w-7r mb-1">Info</button>
        <button class="btn btn-outline-light w-7r mb-1">Light</button>
        <button class="btn btn-outline-dark w-7r mb-1">Dark</button>
                    
                  
Round Buttons
Show Code
                    
        <button class="btn round btn-primary w-7r mb-1">Primary</button>
        <button class="btn round btn-secondary w-7r mb-1">Secondary</button>
        <button class="btn round btn-success w-7r mb-1">Success</button>
        <button class="btn round btn-danger w-7r mb-1">Danger</button>
        <button class="btn round btn-warning w-7r mb-1">Warning</button>
        <button class="btn round btn-info w-7r mb-1">Info</button>
        <button class="btn round btn-light w-7r mb-1">Light</button>
        <button class="btn round btn-dark w-7r mb-1">Dark</button>
                    
                  
Button Sizes
Show Code
                    
        <div>
        <button class="btn btn-primary btn-sm w-7r mb-1">Small</button>
        <button class="btn btn-primary w-7r mb-1">Normal</button>
        <button class="btn btn-primary btn-lg w-7r mb-1">Large</button>
        </div>
        <div>
        <button class="btn btn-secondary btn-sm w-7r mb-1">Small</button>
        <button class="btn btn-secondary w-7r mb-1">Normal</button>
        <button class="btn btn-secondary btn-lg w-7r mb-1">Large</button>
        </div>
                    
                  
Link Buttons
Show Code
                    
        <a class="btn btn-primary w-7r mb-1" href="#">Link</a>
        <a class="btn btn-secondary w-7r mb-1" href="#">Button</a>
        <a class="btn btn-success w-7r mb-1" href="#">Submit</a>
        <a class="btn btn-danger w-7r mb-1" href="#">Reset</a>
        <a class="btn btn-warning w-7r mb-1" href="#">Input</a>
        <a class="btn btn-info w-7r mb-1" href="#">Hint</a>
        <a class="btn btn-light w-7r mb-1" href="#">Label</a>
        <a class="btn btn-dark w-7r mb-1" href="#">Tooltip</a>
                    
                  
Icon Buttons
Show Code
                    
        <button class="btn btn-primary w-7r mb-1">
        <i class="fa fa-cloud-upload" aria-hidden="true"></i>
        Upload
        </button>
        <button class="btn btn-success w-7r mb-1">
        <i class="fa fa-floppy-o" aria-hidden="true"></i>
        Save
        </button>
        <button class="btn btn-danger w-7r mb-1">
        <i class="fa fa-trash-o" aria-hidden="true"></i>
        Delete
        </button>
        <button class="btn btn-warning w-7r mb-1">
        <i class="fa fa-cog" aria-hidden="true"></i>
        Setting
        </button>
                    
                  
Icon Only Buttons
Show Code
                    
        <button class="btn btn-primary mb-1">
        <i class="fa fa-cloud-upload" aria-hidden="true"></i>
        </button>
        <button class="btn btn-success mb-1">
        <i class="fa fa-floppy-o" aria-hidden="true"></i>
        </button>
        <button class="btn btn-danger mb-1">
        <i class="fa fa-trash-o" aria-hidden="true"></i>
        </button>
        <button class="btn btn-warning mb-1">
        <i class="fa fa-cog" aria-hidden="true"></i>
        </button>