On this page

Spinner

---
import { Spinner } from "@/components/starwind/spinner";
---

<Spinner />

Installation

pnpx starwind@latest add spinner

npx starwind@latest add spinner

yarn dlx starwind@latest add spinner

Usage

Custom Size

---
import { Spinner } from "@/components/starwind/spinner";
---

<Spinner class="size-4" />
<Spinner class="size-6" />
<Spinner class="size-8" />
<Spinner class="size-12" />

Custom Color

---
import { Spinner } from "@/components/starwind/spinner";
---

<Spinner class="text-blue-500" />
<Spinner class="text-green-500" />
<Spinner class="text-red-500" />
<Spinner class="text-purple-500" />

In Button

---
import { Spinner } from "@/components/starwind/spinner";
import { Button } from "@/components/starwind/button";
---

<Button disabled>
  <Spinner />
  Loading...
</Button>

API Reference

The component accepts all standard HTML attributes for the <svg> element (excluding role and aria-label which are set automatically for accessibility).

Changelog

v1.0.0

Initial release with starwind v1.10.0