Spinner
Displays a loading spinner animation.
Basic Usage
An indicator that can be used to show a loading state.
Processing payment...
$100.00
Size
Use the size-* utility class to change the size of the spinner.
Color
Use the text- utility class to change the color of the spinner.
Button
Add a spinner to a button to indicate a loading state. The <Button /> will handle the spacing between the spinner and the text.
Badge
You can also use a spinner inside a badge.
SyncingUpdatingProcessing
Input Group
Input Group can have spinners inside <InputGroupAddon>.
Empty
Use spinner in an empty state to show loading.
Processing your request
Please wait while we process your request. Do not refresh the page.
Item
Use the spinner inside <ItemMedia> to indicate a loading state.
Downloading...
129 MB / 1000 MB