Spinner

basecn/spinner

FreeComponent

An indicator that can be used to show a loading state.

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

Source

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

1import { Loader2Icon } from "lucide-react";
2 
3import { cn } from "@/lib/utils";
4 
5function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
6  return (
7    <Loader2Icon
8      role="status"
9      aria-label="Loading"
10      className={cn("size-4 animate-spin", className)}
11      {...props}
12    />
13  );
14}
15 
16export { Spinner };

What it pulls in

npm packages

lucide-react

Files it writes

src/registry/components/ui/spinner.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