Buttons

Use Bootstrap’s button styles for actions in forms, dialogs, and more, with support for multiple sizes and states.

Add .rounded-pill to make buttons more rounded.

<button type="button" class="btn btn-primary rounded-pill">Primary</button>
<button type="button" class="btn btn-secondary rounded-pill">Secondary</button>
...

Button tags

The .btn classes work with <button>, but you can also use them with <a> or <input>.

<a class="btn btn-primary rounded-pill" href="#">Link</a>
<input class="btn btn-primary rounded-pill" type="submit" value="Submit">

Outline buttons

Use .btn-outline-* to remove background images and colors.

<button type="button" class="btn btn-outline-primary rounded-pill">Primary</button>
<button type="button" class="btn btn-outline-secondary rounded-pill">Secondary</button>

Sizes

Need different sizes? Use .btn-lg or .btn-sm for larger or smaller buttons.

<button type="button" class="btn btn-primary btn-lg rounded-pill">Large button</button>
<button type="button" class="btn btn-primary btn-sm rounded-pill">Small button</button>