---
title: "Spinner"
description: "This is a microcomponent that’s used to indicate that the system is loading information. It can be used on a loading surface or on a button."
sidebar_label: "Spinner"
slug: /reference/components/spinner
---

import ComponentDemo from '@site/src/components/ComponentDemo';

# Spinner

This is a microcomponent that’s used to indicate that the system is loading information. It can be used on a loading surface or on a button.

**Package:** `@terreno/ui`  
**Categories:** Component  
**Props interface:** `SpinnerProps`  
**Story source:** [`demo/stories/Spinner.stories.tsx`](https://github.com/flourishhealth/terreno/blob/master/demo/stories/Spinner.stories.tsx)

## Live demo

<ComponentDemo name="Spinner" />

## Props

| Prop | Type | Required | Description |
| --- | --- | --- | --- |
| `color` | `union` |  |  |
| `size` | `union` |  |  |