Skeleton

Placeholder block for loading content.

Quick Preview

Usage

<Skeleton className="h-4 w-32" />

Examples

Default Skeleton

Use this as the starting point for Skeleton. Keep product data, routing, fetching, and authorization logic in the consuming app.

Props

Prop/APITypeDefaultDescription
native div propsReact div props-Pass sizing and layout classes with className.
classNamestring-Local layout or spacing overrides.
native/root propsReact component props-Passed through to the underlying root or primitive.

Accessibility

  • Provide visible labels or accessible names for interactive controls.
  • Preserve the component-provided focus, keyboard, disabled, and invalid-state behavior.
  • Do not communicate state with color alone; include text, icons, or helper copy.

On this page