Skeleton

cardfrom shadcn/ui Essentials

Skeleton

AI Usage Rules

Use Skeleton as a loading placeholder that matches the shape of the content it replaces. Set width and height via className.

Code Template

import { cn } from "@/lib/utils"

function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
  return <div data-slot="skeleton" className={cn("animate-pulse rounded-md bg-accent", className)} {...props} />
}

export { Skeleton }

Props Schema

Property	Type	Default	Description
className	string	—

View raw JSON schema

{
  "type": "object",
  "properties": {
    "className": {
      "type": "string"
    }
  }
}