Skeleton

Extended Features

• Shimmer animation instead of the default pulse

Install

Configure your registry in components.json:

{
  "registries": {
    "@uxio": "https://ui.uxio.dev/r/styles/{style}/{name}.json"
  }
}

Then run:

npx shadcn@latest add @uxio/skeleton

The shimmer animation is added to your theme when you install the component through registry cssVars and css entries, including @keyframes shimmer. Corner radius still comes from your chosen style’s .cn-skeleton rules (for example rounded-md on Nova, rounded-xl on Maia, rounded-none on Lyra).

Examples

Shimmer

Loading placeholders use a diagonal shimmer over bg-muted, using gradient stops on background.