Components

Spinner

Loading indicator with color and size variants.

Import

import { Spinner } from '@dr-max/ui/spinner'

Usage

<script setup lang="ts">
import { Spinner } from '@dr-max/ui/spinner'
</script>

<template>
  <Spinner variant="lightGreen" size="xxl" />
</template>

Variants

dark is meant for dark surfaces — the preview below places it on a dark chip:

<template>
  <Spinner variant="lightGreen" size="xl" />
  <Spinner variant="lightBlue" size="xl" />
  <Spinner variant="dark" size="xl" />
</template>

Playground

variant

size

<script setup lang="ts">
import { Spinner } from '@dr-max/ui/spinner'
</script>

<template>
  <Spinner variant="lightGreen" size="xxl" />
</template>