Spinner Colors

PreviousNext

A spinner component with different colors

Docs
shadcnui-blockscomponent

Preview

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

export default function SpinnerColorsDemo() {
  return (
    <div className="flex gap-4 flex-wrap">
      <Loader2Icon className="animate-spin" />
      <Loader2Icon className="animate-spin text-green-500" />
      <Loader2Icon className="animate-spin text-indigo-500" />
      <Loader2Icon className="animate-spin text-rose-500" />
    </div>
  );
}

Installation

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

Usage

import { Spinner04 } from "@/components/spinner-04"
<Spinner04 />