ReUI Spinner

Component

About

ReUI Spinner with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds ReUI Spinner to your project and fits it to your theme.

Code

How ReUI Spinner is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import {
  Card,
  CardContent,
  CardDescription,
  CardHeader,
  CardTitle,
} from "@/components/ui/reui-spinner-utils/card"
import { Spinner } from "@/components/ui/reui-spinner"

export default function Pattern() {
  return (
    <Card className="min-h-[200px] w-full max-w-xs">
      <CardContent className="flex grow flex-col items-center justify-center gap-4">
        <Spinner className="size-4 opacity-50" />
        <div className="flex flex-col items-center gap-1">
          <p className="text-sm font-medium">Setting up your workspace</p>
          <p className="text-muted-foreground text-xs">
            This may take a few seconds...
          </p>
        </div>
      </CardContent>
    </Card>
  )
}

// Rebuild the demo when the shared Spinner implementation changes.