Data display

Skeleton

A placeholder in the shape of the content that is still loading.

Importimport { Skeleton } from "@/components/ui/Skeleton";
Sourcesrc/components/ui/Skeleton

Give the skeleton the shape of what is coming, so the layout does not jump when the content lands. Size it with your own class — the component brings the surface and the animation, not the dimensions.

Default

Sized here by the docs' own classes — the component sets no dimensions.

Props

Skeleton

PropTypeDefaultDescription
…HTMLAttributesHTMLAttributes<HTMLDivElement>—Set width and height yourself via `className`.