Skip to main content

Spinner

Displays an animated indicator showing users that content or actions are loading. Use to communicate ongoing processes, such as fetching data from a server. For loading states on buttons, use the “loading” property on the Button component instead.

string

A label that describes the purpose of the progress. When set, it will be announced to users using assistive technologies and will provide them with more context. Providing an accessibilityLabel is recommended if there is no accompanying text describing that something is loading.

"base" | "large" | "large-100"
Was this section helpful?

Code

<s-spinner accessibilityLabel="Loading" size="large-100"></s-spinner>

Preview