Spinner

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

SourceTheme Source@chakra-ui/spinner

Import#

import { Spinner } from '@chakra-ui/react'

Usage#

<Spinner />

Spinner with Color#

<Spinner color='red.500' />

Spinner with different size#

<Stack direction='row' gap={4}>
<Spinner size='xs' />
<Spinner size='sm' />
<Spinner size='md' />
<Spinner size='lg' />
<Spinner size='xl' />
</Stack>

Spinner with empty area color#

<Spinner
thickness='4px'
speed='0.65s'
emptyColor='gray.200'
color='blue.500'
size='xl'
/>
Edit this page on GitHub

Proudly made inNigeria by Segun Adebayo

Deployed by â–² Vercel