Spinner

A Spinner shows that something is loading when you do not know how long th last will take to complete, or when the task will take a short enough time where a progress bar would be distracting.

Props

size number 1.25
Will set the length and width of the spinner in rem values.

color string gray-light
Pass a color variable

style string
Add any valid inline CSS.

<script>
  import { Spinner } from "bubbles-ui";
</script>

<div>
  <Spinner />
  <Spinner size={2} color="primary" />
  <Spinner size={3} color="error" />
  <Spinner size={4} color="success" />
  <Spinner size={5} color="info" />
</div>

Spinner

Props

Demo