Feedback

Spinner

An activity indicator.

Spinner

An activity indicator.

Feedback

Syncing registry…

Install

npx shadcn@latest add http://localhost:3000/r/spinner.json

Usage

"use client"

import { Spinner } from "@/components/ui/spinner"

export function Example() {
  return (
    <div className="flex items-center gap-3 text-sm text-muted-foreground">
      <Spinner /> Syncing registry…
    </div>
  )
}

API

Spinner

function Spinner(props: React.ComponentProps<"svg">)

Source code +

import { cn } from "cn"
import { Loader2Icon } from "lucide-react"

function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
  return (
    <Loader2Icon data-slot="spinner" role="status" aria-label="Loading" className={cn("size-4 animate-spin", className)} {...props} />
  )
}

export { Spinner }

Registry JSON ↗