Skeleton

basecn/skeleton

FreeComponent

Use to show a placeholder while content is loading.

Live preview

live · rendered by the registry

Rendered by basecn on their own page — this is the component running, not a screenshot of it.

Install it

npx shadcn@latest add https://basecn.dev/r/skeleton.json

Source

src/registry/components/ui/skeleton.tsxbasecn.dev/r/skeleton.json

1import { cn } from "@/lib/utils";
2 
3function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
4  return (
5    <div
6      data-slot="skeleton"
7      className={cn("bg-accent animate-pulse rounded-md", className)}
8      {...props}
9    />
10  );
11}
12 
13export { Skeleton };

Files it writes

src/registry/components/ui/skeleton.tsx

More from basecn

All 56 items

Same registry, same kind — the ones you would have found next
Component	Registry	Kind	Access	Installs
Accordionaccordion	basecn	Components	Free	2 deps
Alertalert	basecn	Components	Free	1 dep
Alert Dialogalert-dialog	basecn	Components	Free	1 dep
Aspect Ratioaspect-ratio	basecn	Components	Free	no deps
Autocompleteautocomplete	basecn	Components	Free	2 deps
Avataravatar	basecn	Components	Free	1 dep
Badgebadge	basecn	Components	Free	2 deps
Breadcrumbbreadcrumb	basecn	Components	Free	2 deps