Spinner

Spinners provide a visual cue that an action is processing awaiting a course of change or a result.

Theme source

Props#

`color`

Description

The color of the spinner

Type

string

`colorScheme`

Description

The visual color appearance of the component

Type

"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "linkedin" | "facebook" | "messenger" | "whatsapp" | "twitter" | "telegram"

`emptyColor`

Description

The color of the empty area in the spinner

Type

string

Default

transparent

`label`

Description

For accessibility, it is important to add a fallback loading text. This text will be visible to screen readers.

Type

string

Default

Loading...

`size`

Description

The size of the Spinner

Type

"xs" | "sm" | "md" | "lg" | "xl"

Default

md

`speed`

Description

The speed of the spinner.

Type

string

Default

0.45s

`thickness`

Description

The thickness of the spinner

Type

string

Default

2px

`variant`

Description

The variant of the Spinner

Type

string

Edit this page on GitHub