Skeleton

Installation#

1. Install the dependencies

   npm install cn

2. Copy the source into your project

   components/ui/skeleton.tsx

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

3. Make sure the foundation is in place

   Components read their colors, radius and surfaces from the tokens in app/globals.css. See Theming.

Usage#

import { Skeleton } from "@/components/ui/skeleton"

Examples#