Skeleton

Use to show a placeholder while content is loading.

shadcn/ui docs →

Preview

Installation

terminal
$
Other package managers 
bunx --bun shadcn@latest add https://trents.tech/r/skeleton.json

Usage

example.tsx
import { Skeleton } from "@/components/ui/skeleton"

<div className="flex items-center gap-4">
  <Skeleton className="size-12 rounded-full" />
  <div className="space-y-2">
    <Skeleton className="h-4 w-[250px]" />
    <Skeleton className="h-4 w-[200px]" />
  </div>
</div>
0