<button type="button" class="btn btn-primary fw-semibold text-white py-2 px-4 mt-2 me-2">Primary</button>
<button type="button" class="btn btn-secondary fw-semibold text-white py-2 px-4 mt-2 me-2">Secondary</button>
<button type="button" class="btn btn-success fw-semibold text-white py-2 px-4 mt-2 me-2">Success</button>
<button type="button" class="btn btn-danger fw-semibold text-white py-2 px-4 mt-2 me-2">Danger</button>
<button type="button" class="btn btn-warning fw-semibold text-white py-2 px-4 mt-2 me-2">Warning</button>
<button type="button" class="btn btn-info fw-semibold text-white py-2 px-4 mt-2 me-2">Info</button>
<button type="button" class="btn btn-light fw-semibold text-white py-2 px-4 mt-2 me-2">Light</button>
<button type="button" class="btn btn-dark fw-semibold text-white py-2 px-4 mt-2 me-2">Dark</button>
<button type="button" class="btn btn-link fw-semibold text-white py-2 px-4 mt-2 me-2">Link</button>

<button type="button" class="btn btn-outline-primary fw-semibold py-2 px-4 mt-2 me-2 hover-white">Primary</button>
<button type="button" class="btn btn-outline-secondary fw-semibold py-2 px-4 mt-2 me-2 hover-white">Secondary</button>
<button type="button" class="btn btn-outline-success fw-semibold py-2 px-4 mt-2 me-2 hover-white">Success</button>
<button type="button" class="btn btn-outline-danger fw-semibold py-2 px-4 mt-2 me-2 hover-white">Danger</button>
<button type="button" class="btn btn-outline-warning fw-semibold py-2 px-4 mt-2 me-2 hover-white">Warning</button>
<button type="button" class="btn btn-outline-info fw-semibold py-2 px-4 mt-2 me-2 hover-white">Info</button>
<button type="button" class="btn btn-outline-light fw-semibold py-2 px-4 mt-2 me-2 hover-white">Light</button>
<button type="button" class="btn btn-outline-dark fw-semibold py-2 px-4 mt-2 me-2 hover-white">Dark</button>

<button type="button" class="btn bg-primary bg-opacity-10 fw-semibold text-primary py-2 px-4 mt-2 me-2">Primary</button>
<button type="button" class="btn bg-secondary bg-opacity-10 fw-semibold text-secondary py-2 px-4 mt-2 me-2">Secondary</button>
<button type="button" class="btn bg-success bg-opacity-10 fw-semibold text-success py-2 px-4 mt-2 me-2">Success</button>
<button type="button" class="btn bg-danger bg-opacity-10 fw-semibold text-danger py-2 px-4 mt-2 me-2">Danger</button>
<button type="button" class="btn bg-warning bg-opacity-10 fw-semibold text-warning py-2 px-4 mt-2 me-2">Warning</button>
<button type="button" class="btn bg-info bg-opacity-10 fw-semibold text-info py-2 px-4 mt-2 me-2">Info</button>
<button type="button" class="btn bg-light bg-opacity-10 fw-semibold text-light py-2 px-4 mt-2 me-2">Light</button>
<button type="button" class="btn bg-dark bg-opacity-10 fw-semibold text-dark py-2 px-4 mt-2 me-2">Dark</button>
<button type="button" class="btn bg-link bg-opacity-10 fw-semibold text-link py-2 px-4 mt-2 me-2">Link</button>

<button type="button" class="btn btn-primary fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Primary</button>
<button type="button" class="btn btn-secondary fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Secondary</button>
<button type="button" class="btn btn-success fw-semibold text-white py-2 px-4 mt-2 me-2">Success</button>
<button type="button" class="btn btn-danger fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Danger</button>
<button type="button" class="btn btn-warning fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Warning</button>
<button type="button" class="btn btn-info fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Info</button>
<button type="button" class="btn btn-light fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Light</button>
<button type="button" class="btn btn-dark fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Dark</button>
<button type="button" class="btn btn-link fw-semibold text-white py-2 px-4 mt-2 me-2"><i class="ri-add-line"></i> Link</button>

<button type="button" class="btn btn-primary fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Primary</button>
<button type="button" class="btn btn-secondary fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Secondary</button>
<button type="button" class="btn btn-success fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Success</button>
<button type="button" class="btn btn-danger fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Danger</button>
<button type="button" class="btn btn-warning fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Warning</button>
<button type="button" class="btn btn-info fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Info</button>
<button type="button" class="btn btn-light fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Light</button>
<button type="button" class="btn btn-dark fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Dark</button>
<button type="button" class="btn btn-link fw-semibold text-white py-2 px-4 mt-2 me-2 rounded-pill">Link</button>

<button type="button" class="btn btn-outline-primary fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Primary</button>
<button type="button" class="btn btn-outline-secondary fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Secondary</button>
<button type="button" class="btn btn-outline-success fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Success</button>
<button type="button" class="btn btn-outline-danger fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Danger</button>
<button type="button" class="btn btn-outline-warning fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Warning</button>
<button type="button" class="btn btn-outline-info fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Info</button>
<button type="button" class="btn btn-outline-light fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Light</button>
<button type="button" class="btn btn-outline-dark fw-semibold py-2 px-4 mt-2 me-2 hover-white rounded-pill">Dark</button>

<button type="button" class="btn btn-primary fw-semibold text-white py-3 px-4 mt-2 w-100">Block Button</button>
<button type="button" class="btn bg-primary bg-opacity-50 fw-semibold text-white py-3 px-4 mt-2 w-100">Block Button</button>