Skip to main content

BriteSkeleton

Sharedcomponent✓ stamped

Loading skeleton placeholders, single and grouped.

@brite-nites/design-system/primitives/brite-skeleton

Loading placeholder with a left-to-right gradient sweep. Variant presets cover the common shapes (text, title, caption, circle, pill, block, card). Compose multiple skeletons to mimic the shape of the real content that will render.

Variants

Each variant has a default height + radius tuned for its role.

textBody line (13px)
titleHeading line (18px)
captionMetadata (10px)
circleAvatar / icon
pillChip / tag
blockRectangular block
cardCard surface

Multi-line text — BriteSkeletonGroup

Convenience wrapper that renders N text skeletons with the last line tapered. Default 3 lines with a 65% final line.

List row

Compose avatar + text + pill to mimic a list item while it loads.

Card

Title + metadata + body to mimic a detail card.