Skip to content
Work in progress - do not use in production. This component is still being built: it is not flagged Ready for Dev, so its markup, attributes, events and styles can all still change without notice, it is not covered by the accessibility gate, and it is not published to npm. It is on this site so the work can be seen and reviewed - nothing more.

Skeleton

A decorative loading placeholder, rendered as <span is="root-skeleton">.

Usage

<span is="root-skeleton"></span>

Attributes

Attribute Type Default Description
shape 'line' | 'text' | 'circle' 'line' Placeholder shape
size 'medium' | 'large' 'medium' Block height

Extends

HTMLElement - use with <span is="root-skeleton">. Decorative (aria-hidden="true"); pair it with a root-spinner or status text so assistive tech is told that content is loading. The shimmer stops under prefers-reduced-motion.