Spinner

Extended Features

• Redesigned tick-based animation

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/spinner

Animation CSS is injected into your global styles when you install the component (shadcn registry css and cssVars).

Examples

Default

Custom Size and Ticks

Props

• size — Size of the spinner (default: 1em)
• ticksCount — Number of ticks (default: 12)
• tickWidth — Width of each tick (default: "8%")
• className — Extra Tailwind classes