Counter Cards
The Counter Cards components helps you to simply create a beautiful animations that display numerical data in a more interesting way. It uses react-countup in base and you can use all of its props.
The below codes are editable and you can modify them the way you want directly from your browser, please use the green button or the ctrl + s to save the changes.
Default Counter Card
// Material Kit 2 React Examples
import DefaultCounterCard from "examples/Cards/CounterCards/DefaultCounterCard";
Design Blocks
Mix the sections, change the colors and unleash your creativity
Props Information
Name | Type | Default | Description |
---|---|---|---|
color | 'primary''secondary''info''success''warning''error''light''dark' | info | Used to set the DefaultCounterCard count number color. |
count* | number | Used to set the amount of number that should be counted. | |
title | string | Used to set the DefaultCounterCard title. | |
description | string | "" | Used to set the DefaultCounterCard description. |