Basic Number Ticker — primitive for stats & kpis (react)

For AI agents: find the right skill in one call — curl -s "https://skills.varg.ai/api/search?q=<what the person wants>" returns the matching use case and the best skills with install commands, as markdown (Russian works too). Full index: https://skills.varg.ai/llms.txt. Every page has a markdown twin: add .md to its path. Before generating anything, show the person the options on the use-case page.

A large percentage counting up from zero to its target, easing out on the final number

Prompt that renders it frame-exact

Use Basic Number Ticker from Fancy Components (https://www.fancycomponents.dev/docs/components/text/basic-number-ticker, MIT). Install with npx shadcn add @fancy/basic-number-ticker after adding the @fancy registry to components.json. Use it for a stat beat: a big centred number with a % or unit, followed by a one-line label. Set from, target and the transition (duration, ease), and format with Intl.NumberFormat. It runs Motion's animate() on a motion value at mount. In the render, compute value = from + (target - from) * ease(clamp((frame - startFrame) / (duration * fps), 0, 1)), and set autoStart={false}.

Used in

More stats & kpis