Primitives
Skeleton
Loading placeholder with a token-driven shimmer.
Composition
The preferred shape for composing the installed primitive from its exported parts.
Root
Single-slot surface with no nested parts.
SkeletonThe refined source installs this primitive from src/registry/sources/refined/ui/skeleton.tsx. Install it on its own with the command above, or inspect the source below.
npx shadcn@latest add http://127.0.0.1:3000/r/refined/skeleton.jsonRaw code
Primary installed primitive source
Skeleton slot
src/registry/sources/refined/ui/skeleton.tsx
import type { ComponentProps } from "react";import { cn } from "@/components/refined-ui/lib/cn";import { skinSlot } from "@/components/refined-ui/skin";// Token-driven `shimmer` sweep instead of flat pulse — reads as "streaming in", follows theme colours/radius/motion tempo.export function Skeleton({ className, ...props }: ComponentProps<"div">) { return ( <div data-ui="agent" data-slot="skeleton" className={cn("rounded-md", skinSlot("skeleton-paint", {}) ?? "shimmer", skinSlot("skeleton", {}), className)} {...props} /> );}