Spinners

Indicate the loading state of a component or page with Bootstrap spinners, built entirely with HTML, CSS, and no JavaScript. Read Bootstrap documentation

.spinner-border.text-primary.mr-2(role="status")
	span.sr-only Loading...
.spinner-border.text-secondary.mr-2(role="status")
	span.sr-only Loading...
.spinner-grow.text-success.mr-2(role="status")
	span.sr-only Loading...
.spinner-grow.text-danger.mr-2(role="status")
	span.sr-only Loading...
button.btn.btn-primary.btn-sm.mr-2(type="button" disabled="")
	span.spinner-border.spinner-border-sm(role="status" aria-hidden="true")
	span.sr-only Loading...
button.btn.btn-primary.btn-sm.mr-2(type="button" disabled="")
	span.spinner-border.spinner-border-sm(role="status" aria-hidden="true")
	|   Loading...

<div class="spinner-border text-primary mr-2" role="status">
	<span class="sr-only">Loading...</span>
</div>
<div class="spinner-border text-secondary mr-2" role="status">
	<span class="sr-only">Loading...</span>
</div>
<div class="spinner-grow text-success mr-2" role="status">
	<span class="sr-only">Loading...</span>
</div>
<div class="spinner-grow text-danger mr-2" role="status">
	<span class="sr-only">Loading...</span>
</div>
<button class="btn btn-primary btn-sm mr-2" type="button" disabled="">
	<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
	<span class="sr-only">Loading...</span>
</button>
<button class="btn btn-primary btn-sm mr-2" type="button" disabled="">
	<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
	Loading...
</button>

Visit Bootstrap documentation to learn more about this component

Version 2.0.0, [email protected]