Skeleton
Skeleton displays placeholder content blocks that mimic the layout of loading text at various sizes.
Installation
npx sdaia-ui@latest add skeleton
Usage
import { Skeleton } from "@/components/ui/skeleton"<Skeleton size="text-large" />Examples
Default
The default skeleton block representing a large text line.
1
<Skeleton size="text-lg" />Sizes
Text skeleton placeholder available in Small, Medium, Large, and X Large sizes.
Loading preview…
1
<Skeleton size="text-sm" />2
<Skeleton size="text-md" />3
<Skeleton size="text-lg" />4
<Skeleton size="text-xl" />API Reference
SkeletonProps
Props for the Skeleton component.
Prop | Type | Default | Required |
|---|---|---|---|
size | 'text-sm' | 'text-md' | 'text-lg' | 'text-xl' | 'text-xl' | optional |