Color Schemes for Stat are not implemented in the default theme. You can extend the theme to implement them.
Stat
As the name implies, the `Stat` component is used to display some statistics.
Import#
import {Stat,StatLabel,StatNumber,StatHelpText,StatArrow,StatGroup,} from '@chakra-ui/react'
Basic Usage#
<Stat><StatLabel>Collected Fees</StatLabel><StatNumber>£0.00</StatNumber><StatHelpText>Feb 12 - Feb 28</StatHelpText></Stat>
Stat with Indicator#
<StatGroup><Stat><StatLabel>Sent</StatLabel><StatNumber>345,670</StatNumber><StatHelpText><StatArrow type='increase' />23.36%</StatHelpText></Stat><Stat><StatLabel>Clicked</StatLabel><StatNumber>45</StatNumber><StatHelpText><StatArrow type='decrease' />9.05%</StatHelpText></Stat></StatGroup>
Props#
StatLabel,StatHelpText,StatNumbercomposes Text component.StatArrowcomposes Icon component.StatandStatGroupcomposes Box component.
colorScheme
colorSchemeDescription
Type
(string & {})size
sizeType
"md"Default
"md"variant
variantDescription
Variants for Stat are not implemented in the default theme. You can extend the theme to implement them.
Type
stringTODO