<button type="button" class="btn btn-primary">Primary</button>

<button type="button" class="btn btn-secondary">Secondary</button>

<button type="button" class="btn btn-success">Success</button>

<button type="button" class="btn btn-danger">Danger</button>

<button type="button" class="btn btn-warning">Warning</button>

<button type="button" class="btn btn-info">Info</button>

          

<button type="button" class="btn btn-square btn-primary">Primary</button>

<button type="button" class="btn btn-square btn-secondary">Secondary</button>

<button type="button" class="btn btn-square btn-success">Success</button>

<button type="button" class="btn btn-square btn-danger">Danger</button>

<button type="button" class="btn btn-square btn-warning">Warning</button>

<button type="button" class="btn btn-square btn-info">Info</button>

              

<button type="button" class="mb-1 btn btn-pill btn-primary">Primary</button>

<button type="button" class="mb-1 btn btn-pill btn-secondary">Secondary</button>

<button type="button" class="mb-1 btn btn-pill btn-success">Success</button>

<button type="button" class="mb-1 btn btn-pill btn-danger">Danger</button>

<button type="button" class="mb-1 btn btn-pill btn-warning">Warning</button>

<button type="button" class="mb-1 btn btn-pill btn-info">Info</button>

              

<button type="button" class="mb-1 btn btn-primary">
  <i class=" mdi mdi-star-outline mr-1"></i>
  Primary
</button>


<button type="button" class="mb-1 btn btn-secondary">
  <i class=" mdi mdi-diamond-outline mr-1"></i>
  Secondary
</button>


<button type="button" class="mb-1 btn btn-success">
  <i class=" mdi mdi-checkbox-marked-outline mr-1"></i>
  Success
</button>


<button type="button" class="mb-1 btn btn-info">
  <i class=" mdi mdi-information-outline mr-1"></i>
  Info
</button>


<button type="button" class="mb-1 btn btn-warning">
  <i class=" mdi mdi-alert-outline mr-1"></i>
  Warning
</button>


<button type="button" class="mb-1 btn btn-danger">
  <i class=" mdi mdi-close-circle-outline mr-1"></i>
  Danger
</button>

                

<button type="button" class="btn btn-sm btn-primary">Primary</button>

<button type="button" class="btn btn-sm btn-secondary">Secondary</button>

<button type="button" class="btn btn-sm btn-success">Success</button>

<button type="button" class="btn btn-sm btn-danger">Danger</button>

<button type="button" class="btn btn-sm btn-warning">Warning</button>

<button type="button" class="btn btn-sm btn-info">Info</button>

              

<button type="button" class="btn btn-lg btn-primary">Primary</button>

<button type="button" class="btn btn-lg btn-secondary">Secondary</button>

<button type="button" class="btn btn-lg btn-success">Success</button>

<button type="button" class="btn btn-lg btn-danger">Danger</button>

<button type="button" class="btn btn-lg btn-warning">Warning</button>

<button type="button" class="btn btn-lg btn-info">Info</button>

              

<button type="button" class="btn btn-primary" disabled>Primary</button>

<button type="button" class="btn btn-secondary" disabled>Secondary</button>

<button type="button" class="btn btn-success" disabled>Success</button>

<button type="button" class="btn btn-danger" disabled>Danger</button>

<button type="button" class="btn btn-warning" disabled>Warning</button>

<button type="button" class="btn btn-info" disabled>Info</button>

          

<button type="button" class="btn btn-block btn-primary">Primary</button>

<button type="button" class="btn btn-block btn-secondary">Secondary</button>

<button type="button" class="btn btn-block btn-success">Success</button>

<button type="button" class="btn btn-block btn-danger">Danger</button>

<button type="button" class="btn btn-block btn-warning">Warning</button>

<button type="button" class="btn btn-block btn-info">Info</button>

                

<button type="button" class="btn btn-outline-primary">Primary</button>

<button type="button" class="btn btn-outline-secondary">Secondary</button>

<button type="button" class="btn btn-outline-success">Success</button>

<button type="button" class="btn btn-outline-info">Info</button>

<button type="button" class="btn btn-outline-warning">Warning</button>

<button type="button" class="btn btn-outline-danger">Danger</button>

          

<button type="button" class="btn btn-outline-primary btn-square">Primary</button>

<button type="button" class="btn btn-outline-secondary btn-square">Secondary</button>

<button type="button" class="btn btn-outline-success btn-square">Success</button>

<button type="button" class="btn btn-outline-info btn-square">Info</button>

<button type="button" class="btn btn-outline-warning btn-square">Warning</button>

<button type="button" class="btn btn-outline-danger btn-square">Danger</button>

              

<button type="button" class="mb-1 btn btn-outline-primary btn-pill">Primary</button>

<button type="button" class="mb-1 btn btn-outline-secondary btn-pill">Secondary</button>

<button type="button" class="mb-1 btn btn-outline-success btn-pill">Success</button>

<button type="button" class="mb-1 btn btn-outline-info btn-pill">Info</button>

<button type="button" class="mb-1 btn btn-outline-warning btn-pill">Warning</button>

<button type="button" class="mb-1 btn btn-outline-danger btn-pill">Danger</button>

              

<button type="button" class="mb-1 btn btn-primary">
  <i class=" mdi mdi-star-outline mr-1"></i>
  Primary
</button>

<button type="button" class="mb-1 btn btn-secondary">
  <i class=" mdi mdi-diamond-outline mr-1"></i>
  Secondary
</button>

<button type="button" class="mb-1 btn btn-success">
  <i class=" mdi mdi-checkbox-marked-outline mr-1"></i>
  Success
</button>

<button type="button" class="mb-1 btn btn-info">
  <i class=" mdi mdi-information-outline mr-1"></i>
  Info
</button>

<button type="button" class="mb-1 btn btn-warning">
  <i class=" mdi mdi-alert-outline mr-1"></i>
  Warning
</button>

<button type="button" class="mb-1 btn btn-danger">
  <i class=" mdi mdi-close-circle-outline mr-1"></i>
  Danger
</button>

          

<button type="button" class="btn btn-sm btn-outline-primary">Primary</button>

<button type="button" class="btn btn-sm btn-outline-secondary">Secondary</button>

<button type="button" class="btn btn-sm btn-outline-success">Success</button>

<button type="button" class="btn btn-sm btn-outline-info">Info</button>

<button type="button" class="btn btn-sm btn-outline-warning">Warning</button>

<button type="button" class="btn btn-sm btn-outline-danger">Danger</button>

          

<button type="button" class="btn btn-lg btn-outline-primary">Primary</button>

<button type="button" class="btn btn-lg btn-outline-secondary">Secondary</button>

<button type="button" class="btn btn-lg btn-outline-success">Success</button>

<button type="button" class="btn btn-lg btn-outline-info">Info</button>

<button type="button" class="btn btn-lg btn-outline-warning">Warning</button>

<button type="button" class="btn btn-lg btn-outline-danger">Danger</button>

          

<button type="button" class="btn btn-outline-primary"disabled>Primary</button>

<button type="button" class="btn btn-outline-secondary"disabled>Secondary</button>

<button type="button" class="btn btn-outline-success"disabled>Success</button>

<button type="button" class="btn btn-outline-info"disabled>Info</button>

<button type="button" class="btn btn-outline-warning"disabled>Warning</button>

<button type="button" class="btn btn-outline-danger"disabled>Danger</button>

          

  
  <button type="button" class="btn btn-block btn-outline-primary">Primary</button>

  <button type="button" class="btn btn-block btn-outline-secondary">Secondary</button>

  <button type="button" class="btn btn-block btn-outline-success">Success</button>

  <button type="button" class="btn btn-block btn-outline-info">Info</button>

  <button type="button" class="btn btn-block btn-outline-warning">Warning</button>

  <button type="button" class="btn btn-block btn-outline-danger">Danger</button>