Component overview
The Big Numbers is a component that shows up to four statistics and has an animation that increases the number up from zero up until the number value inserted is reached.
- Keep title, labels and numbers length in mind: Review the length of title, labels and numbers, as too long values might not fit in all screen sizes.
- Consider the number of values: Too many numbers can make the content difficult to read, but 1 number can look too empty. It's best to use between 2 and 4 numbers.
- Use or skip title: You can skip title, then the component will be thinner!
- Set decimal points when you need them: it's worth to use 2 decimal points for float values like 3.75.
Example Big Numbers components
Example #1
Big Numbers with title
By the numbers...
$32500
Total cost
175
Items
185.71
Average
Example #2
Big Numbers without title
70
Minutes
475.50
Miles
No Border Style, Paragraph Tag Title Example, No Animation
70
Minutes
475.50
Miles
16
Sweets
No Border, h3 Title Tag, No Animation
4
Calling birds
5
Golden Rings