Data display

Counting number readout

A large stat that counts up to its value on a decelerating curve, writing the text directly each frame so the layout never jitters.

Weekly installs

installs

Up 18% from last week

Using Counting number readout

A large stat that counts up to its value on a decelerating curve, writing the text directly each frame so the layout never jitters.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: target, duration, decimals, suffix, accent

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

2299Animated metric counterData displayA large bare numeral that springs up from a starting value to its target the moment it scrolls into view, overshooting slightly before it settles, with thousands separators and an optional suffix.

2133Counting metricData displayA large number that eases from a starting value up to its target with a gentle spring the first time it is seen, formatted with thousands separators and fixed decimals.

2134Counting readoutData displayA metric figure that counts from a start value up to its target on a spring the first time it is seen, with fixed decimals and optional zero padding.

1946Count wheel badgeData displayA vertical number wheel that rolls through rounded steps to a total, with a center star that fills as the count climbs.

2042Sliding digit counterData displayA total that counts up by rolling each digit column into place while a star fills alongside it and bursts a few particles when it lands.

2216Rolling stat tilesData displayA row of stat tiles whose big numbers roll digit by digit to a new value instead of snapping.