Single Element CSS Spinners

A collection of single element css spinner/loading indicators.

Basic Spinner

Small
Loading...
Default
Loading...
Large
Loading...
Example Code:

<div class="spinner spinner-sm">Loading...</div>
<div class="spinner">Loading...</div>
<div class="spinner spinner-lg">Loading...</div>
Completely configurable via SCSS:

$baseSize: 2rem;
$baseSpeed: 900ms;
$basePrimaryColor: #1971c2;
$baseSecondaryColor: #d0ebff;

Cube Spinner

Loading...
Example Code:

<div class="cube-spinner">Loading...</div>

Cube Stacked Spinner

Loading...
Example Code:

<div class="cube-stacked--spinner">Loading...</div>