Fieldbook
Sign in

Data display

Animated metric counter

A 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.

Using Animated metric counter

A 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.

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, startValue, 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

Counting number readout
2328Counting number readoutData displayA large stat that counts up to its value on a decelerating curve, writing the text directly each frame so the layout never jitters.
Counting readout
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.
Counting metric
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.
Count wheel badge
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.
Sliding digit counter
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.
Rolling stat tiles
2216Rolling stat tilesData displayA row of stat tiles whose big numbers roll digit by digit to a new value instead of snapping.