@fabioliberto/loading-spinner

A tiny, customizable React loading spinner. Works with React 18+.

Install

npm install @fabioliberto/loading-spinner
# or
yarn add @fabioliberto/loading-spinner
# or
pnpm add @fabioliberto/loading-spinner

Usage

import { Spinner } from "@fabioliberto/loading-spinner";

export default function App() {
  return (
    <div style={{ minHeight: 120, display: "grid", placeItems: "center" }}>
      <Spinner size="lg" color="#7c3aed" />
    </div>
  );
}

Props

| Prop | Type | Default | Description | | ------- | ----------------------------------- | --------- | ---------------------------------------------------------- | | size | "sm" \| "md" \| "lg" \| string | "md" | Spinner size. Can be preset or custom (e.g. "40px"). | | color | string | #808080 | Spinner color. Inherits text color if not set. |

Examples

// Tailwind example
<div className="text-indigo-600">
  <Spinner size="sm" />
</div>

// Custom inline style
<Spinner size="48px" color="tomato" />

License

MIT © Fabio Liberto