Loader

Svelte

The loader component indicates an active wait state for a page, section, or interactive element.

Classes

Class	Applied to	Description
`.s-loader`	N/A	Base class for the loader component
`.s-loader--sr-text`	`.s-loader`	Child necessary to render the center loader block and renders the accessible text
`.s-loader__sm`	`.s-loader`	A small variant of the loader component
`.s-loader__lg`	`.s-loader`	A large variant of the loader component

The base loader component displays three animated squares.

<div class="s-loader">
    <div class="s-loader--sr-text">Loading…</div>
</div>

Loading…