Horizon UI Boilerplate - Default
Chakra UI Statistics Card
The Statistics card offers an easy way to display important information in any dashboard.
page.tsx
import Statistics from '@/components/dashboard/main/cards/Statistics';
<Statistics
icon={
<Flex
h={'56px'}
w={'56px'}
justifyContent="center"
alignItems={'center'}
rounded="full"
fontSize="36px"
color={brandColor}
bg={bg}
>
<Icon as={MdOutlineGroup} w="24px" h="24px" />
</Flex>
}
title="Credits used in the last month"
value="46,042"
/>