Everyday

Playground

Spinner

ui
control

Indeterminate loading indicator

Inline loading states, button loading, skeleton fallback

import { Spinner } from "@everydayos/ui";

Usage

Standalone loading indicator

<Spinner className="size-6" />

Examples

Button with Spinner

Loading state inside button

<Button disabled>
  <Spinner className="size-4" />
  Loading...
</Button>

Composition

Pairs well with

Button
Stack
Text

When to avoid

  • Determinate progress — use Progress instead
  • Full-page loading — use skeleton or page-level loading UI