<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-light">Light</button>
<button type="button" class="btn btn-dark">Dark</button>
<button type="button" class="btn btn-link">Link</button>
<button type="button" class="btn btn-primary rounded-pill">Primary</button>
<button type="button" class="btn btn-secondary rounded-pill">Secondary</button>
<button type="button" class="btn btn-success rounded-pill">Success</button>
<button type="button" class="btn btn-danger rounded-pill">Danger</button>
<button type="button" class="btn btn-warning rounded-pill">Warning</button>
<button type="button" class="btn btn-info rounded-pill">Info</button>
<button type="button" class="btn btn-light rounded-pill">Light</button>
<button type="button" class="btn btn-dark rounded-pill">Dark</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-danger">Danger</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-outline-info">Info</button>
<button type="button" class="btn btn-outline-light">Light</button>
<button type="button" class="btn btn-outline-dark">Dark</button>
<button type="button" class="btn btn-outline-primary"><i class="bx bx-home-circle"></i></button>
<button type="button" class="btn btn-outline-secondary"><i class="bx bx-home-circle"></i></button>
<button type="button" class="btn btn-outline-success"><i class="bx bx-home-circle"></i></button>
<button type="button" class="btn btn-outline-danger"><i class="bx bx-home-circle"></i></button>
<button type="button" class="btn btn-outline-warning"><i class="bx bx-home-circle"></i></button>
<button type="button" class="btn btn-outline-info"><i class="bx bx-home-circle"></i></button>
<button type="button" class="btn btn-outline-light"><i class="bx bx-home-circle"></i></button>
<button type="button" class="btn btn-outline-dark"><i class="bx bx-home-circle"></i></button>
Large Button
<button type="button" class="btn btn-primary btn-lg">Large button</button>
<button type="button" class="btn btn-secondary btn-lg">Large button</button>
<button type="button" class="btn btn-success btn-lg">Large button</button>
<button type="button" class="btn btn-danger btn-lg">Large button</button>
<button type="button" class="btn btn-warning btn-lg">Large button</button>
<button type="button" class="btn btn-info btn-lg">Large button</button>
<button type="button" class="btn btn-light btn-lg">Large button</button>
<button type="button" class="btn btn-dark btn-lg">Large button</button>
Medium Button
<button type="button" class="btn btn-primary btn-md">Large button</button>
<button type="button" class="btn btn-secondary btn-md">Large button</button>
<button type="button" class="btn btn-success btn-md">Large button</button>
<button type="button" class="btn btn-danger btn-md">Large button</button>
<button type="button" class="btn btn-warning btn-md">Large button</button>
<button type="button" class="btn btn-info btn-md">Large button</button>
<button type="button" class="btn btn-light btn-md">Large button</button>
<button type="button" class="btn btn-dark btn-md">Large button</button>
Small Button
<button type="button" class="btn btn-primary btn-sm">Large button</button>
<button type="button" class="btn btn-secondary btn-sm">Large button</button>
<button type="button" class="btn btn-success btn-sm">Large button</button>
<button type="button" class="btn btn-danger btn-sm">Large button</button>
<button type="button" class="btn btn-warning btn-sm">Large button</button>
<button type="button" class="btn btn-info btn-sm">Large button</button>
<button type="button" class="btn btn-light btn-sm">Large button</button>
<button type="button" class="btn btn-dark btn-sm">Large button</button>
Primary link Secondary Link Success Link Danger Link Warning Link Info Link Light Link Dark Link
<a href="#" class="btn btn-primary active" role="button">Primary link</a>
<a href="#" class="btn btn-secondary active" role="button">Secondary link</a>
<a href="#" class="btn btn-success active" role="button">Success link</a>
<a href="#" class="btn btn-danger active" role="button">Danger link</a>
<a href="#" class="btn btn-warning active" role="button">Warning link</a>
<a href="#" class="btn btn-info active" role="button">Info link</a>
<a href="#" class="btn btn-light active" role="button">Light link</a>
<a href="#" class="btn btn-dark active" role="button">Dark link</a>
<button type="button" class="btn btn-primary" disabled>Primary button</button>
<button type="button" class="btn btn-secondary" disabled>Secondary Button</button>
<button type="button" class="btn btn-success" disabled>Success Button</button>
<button type="button" class="btn btn-danger" disabled>Danger Button</button>
<button type="button" class="btn btn-warning" disabled>Warning Button</button>
<button type="button" class="btn btn-info" disabled>Info Button</button>
<button type="button" class="btn btn-light" disabled>Light Button</button>
<button type="button" class="btn btn-dark" disabled>Dark Button</button>
<div class="btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn btn-secondary active">
<input type="radio" name="options" id="option1" checked> Active
</label>
<label class="btn btn-secondary">
<input type="radio" name="options" id="option2"> Radio
</label>
<label class="btn btn-secondary">
<input type="radio" name="options" id="option3"> Radio
</label>
</div>
<button type="button" class="btn btn-primary btn-lg btn-block">Block level button</button>
<button type="button" class="btn btn-secondary btn-lg btn-block">Block level button</button>
<button type="button" class="btn btn-success btn-lg btn-block">Block level button</button>
<button type="button" class="btn btn-danger btn-lg btn-block">Block level button</button>
<button type="button" class="btn btn-warning btn-lg btn-block">Block level button</button>
<button type="button" class="btn btn-info btn-lg btn-block">Block level button</button>
<button type="button" class="btn btn-light btn-lg btn-block">Block level button</button>
<button type="button" class="btn btn-dark btn-lg btn-block">Block level button</button>