Loading indicator

The expressive loading indicator (COMPONENT_SPEC §7): a shape morphing through Compose's seven polygons on its spring while it rotates.

The element <m3e-loading-indicator> and the React component <LoadingIndicator> draw it with SVG. Under prefers-reduced-motion it holds its first frame.

Indeterminate

Determinate

Progress

Sizes

Resize the root: the 48 / 38 container-to-shape ratio holds from 24 to 240.

CSS only

Without JavaScript, a static shape (here SoftBurst, rendered at build time with @kyralabs/m3e-shapes) rotates once per Compose global rotation.