Component

Skeleton

Reserves layout space with a shimmering placeholder while content loads.

Install

Run the CLI to copy the source into your project.

pnpm dlx @stalk-ui/cli add @stalk-ui/skeleton

Examples

Live previews render through the docs app's PandaCSS codegen.

Theme
<Skeleton style={{ height: 14, width: 240 }} />
Theme
<Skeleton radius="full" style={{ height: 48, width: 48 }} />

Props

Public component props extracted from the source TypeScript types.

PropTypeRequiredDefaultDescription
`radius``SkeletonRadius`No--

Variants

Variant axes exposed by the underlying PandaCSS recipe or slot recipe.

VariantValues
`radius``none`, `sm`, `md`, `lg`, `full`

Registry

Files this component contributes to your registry install.

  • Manifest: `/r/skeleton.json`
  • Recipe: `skeleton`
  • Files: `src/components/ui/skeleton.tsx`