Feedback and states · §5.27

Skeleton

Loading placeholders shaped like what is coming.

Layout
Theme
Contrast
Language
Motion
Text size

Code

<LoadingSkeleton label={t("a11y.loadingVisit")} variant="timeline" />

Accessibility

  • aria-busy with a label; the shimmer is static under reduced motion.

Usage

Do

  • Match the final layout.

Don't

  • No spinners for content.

Platforms

Web
apps/web/components/ui/skeleton.tsx, apps/web/components/edflow/states.tsx
iOS
SwiftUI .redacted(reason: .placeholder)
Android
Compose placeholder shapes