Spinner Sizes

PreviousNext

A spinner component with different sizes

Docs
shadcnui-blockscomponent

Preview

Loading preview…
components/customized/spinner/spinner-05.tsx
import { Loader2Icon } from "lucide-react";

export default function SpinnerSizesDemo() {
  return (
    <div className="flex gap-4 flex-wrap items-center">
      <Loader2Icon className="animate-spin h-4 w-4" />
      <Loader2Icon className="animate-spin h-5 w-5" />
      <Loader2Icon className="animate-spin h-6 w-6" />
      <Loader2Icon className="animate-spin h-8 w-8" />
    </div>
  );
}

Installation

npx shadcn@latest add @shadcnui-blocks/spinner-05

Usage

import { Spinner05 } from "@/components/spinner-05"
<Spinner05 />