35Spinner

Indeterminate wait under about a second, where a skeleton would flash. Longer than that, a spinner tells the user nothing — use Skeleton.

Use it for

Inline busy state on a small control or fetch

Not for

Page-level loading — Skeleton

Sizes

markup

<span class="ns-spinner" aria-hidden="true"></span>
<span class="ns-spinner ns-spinner--lg" aria-hidden="true"></span>
<span class="ns-visually-hidden" role="status">Loading</span>

Accessibility contract

Pair with a visually-hidden role="status" label