Skip to content
Theme UI
GitHub

Spinner

Spinning SVG loading indicator

import { Spinner } from 'theme-ui'
Loading...

Props

NameTypeDescription
titleString(default 'loading') Text for SVG <title> tag
sizeNumber(default 48) chart diameter
strokeWidthNumber(default 4) stroke width

A title attribute should be provided to the component for accessibility purposes. The element uses role='img' by default. Pass any overrides or additional attributes for the SVG element as props.

Variants

Spinner variants can be defined anywhere in the theme object.

// example theme variants
{
styles: {
spinner: {
color: 'red',
},
},
}
// <Spinner variant='styles.spinner' />
Edit the page on GitHub
Previous:
Donut
Next:
Avatar