Examples

  <button type="button" class="btn btn-default">Default</button>
  <button type="button" class="btn btn-primary">Primary</button>
  <button type="button" class="btn btn-info">Info</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 class="btn btn-opacity-default" type="button">Default</button>
  <button class="btn btn-opacity-primary" type="button">Primary</button>
  <button class="btn btn-opacity-info" type="button">Info</button>
  <button class="btn btn-opacity-success" type="button">Success</button>
  <button class="btn btn-opacity-danger" type="button">Danger</button>
  <button class="btn btn-opacity-warning" type="button">Warning</button>

Raised Buttons

  <button type="button" class="btn btn-raised btn-raised-default">Default</button>
  <button type="button" class="btn btn-raised btn-raised-primary">Primary</button>
  <button type="button" class="btn btn-raised btn-raised-info">Info</button>
  <button type="button" class="btn btn-raised btn-raised-success">Success</button>
  <button type="button" class="btn btn-raised btn-raised-danger">Danger</button>
  <button type="button" class="btn btn-raised btn-raised-warning">Warning</button>

Outline Buttons

  <button type="button" class="btn btn-outline btn-outline-primary">Primary</button>
  <button type="button" class="btn btn-outline btn-outline-info">Info</button>
  <button type="button" class="btn btn-outline btn-outline-success">Success</button>
  <button type="button" class="btn btn-outline btn-outline-danger">Danger</button>
  <button type="button" class="btn btn-outline btn-outline-warning">Warning</button>

Links

  <button class="btn btn-link btn-link-primary ">Primary</button>
  <button class="btn btn-link btn-link-info">Info</button>
  <button class="btn btn-link btn-link-success">Success</button>
  <button class="btn btn-link btn-link-warning">Warning</button>
  <button class="btn btn-link btn-link-danger">Danger</button>
  <button class="btn btn-link btn-link-light">Light</button>
  <button class="btn btn-link btn-link-dark">Dark</button>
  

Button Variation

  <button type="button" class="btn btn-primary btn-rounded">Default rounded</button>
  <button type="button" class="btn btn-outline btn-outline-primary btn-rounded">Outline rounded</button>
  <button type="button" class="btn btn-raised btn-raised-primary btn-rounded">Raised rounded</button>

Icon buttons

  <button class="btn btn-primary"><i data-feather="shopping-cart"></i>Feather Icon</button>
  <button class="btn btn-primary"><i class="fas fa-download"></i>Fontawesome</button>
  <button class="btn btn-raised btn-raised-primary rounded-circle btn-icon"><i class="fas fa-download"></i></button>

Social Buttons

  <button class="btn btn-google"><i class="fab fa-google"></i> Google</button>
  <button class="btn btn-facebook"><i class="fab fa-facebook-f"></i>Facebook</button>
  <button class="btn btn-twitter"><i class="fab fa-twitter"></i>Twitter</button>
  <button class="btn btn-google btn-raised">Google</button>
  <button class="btn btn-facebook btn-raised">Facebook</button>
  <button class="btn btn-twitter btn-raised">Twitter</button>
  <button class="btn btn-google btn-outline"><i class="fab fa-google"></i>Google</button>
  <button class="btn btn-outline btn-facebook"><i class="fab fa-facebook-f"></i>Facebook</button>
  <button class="btn btn-twitter btn-outline"><i class="fab fa-twitter"></i>Twitter</button>

Button Size

<button type="button" class="btn btn-primary btn-sm">Small button</button>
  <button type="button" class="btn btn-primary">Default button</button>
  <button type="button" class="btn btn-primary btn-lg">Large button</button>
  <button class="btn btn-raised btn-raised-primary rounded-circle btn-sm btn-icon"><i class="fas fa-download"></i></button>
  <button class="btn btn-raised btn-raised-primary rounded-circle btn-icon"><i class="fas fa-download"></i></button>
  <button class="btn btn-raised btn-raised-primary rounded-circle btn-lg btn-icon"><i class="fas fa-download"></i></button>