Home Components Spinner
Spinner
Overview Playground API
Spinners provide a visual cue that an action is processing awaiting a course of change or a result.
Usage
Loading...

  <goat-spinner>Loading...</goat-spinner>
Color Variants



  <goat-spinner></goat-spinner>

  <goat-spinner style="--goat-spinner-color: var(--color-primary)"></goat-spinner>
  <goat-spinner style="--goat-spinner-color: var(--color-error)"></goat-spinner>
  <goat-spinner style="--goat-spinner-color: var(--color-warning)"></goat-spinner>
  <goat-spinner style="--goat-spinner-color: var(--color-success)"></goat-spinner>

  <br>

  <goat-spinner class="rainbow"></goat-spinner>
Sizes Fancy larger or smaller spinners? Add size attribute for additional sizes.

  <goat-spinner size="sm"></goat-spinner>
  <goat-spinner></goat-spinner>
  <goat-spinner size="lg"></goat-spinner>
  <goat-spinner size="100px"></goat-spinner>
Usage Color Variants Sizes
Work in progress
Properties
Events
Methods
CSS Custom Properties
Previous Next