StacklyUI
Component

Number Ticker

Counts from a starting value to the target when it scrolls into view. The tween writes formatted text straight to the DOM (no per-frame re-render), and under reduced motion it renders the final value immediately.

0

Stars

0.0%

Uptime

$0

MRR

Installation

Registry CLI — copy the source straight into your project:

$pnpm dlx shadcn@latest add @stacklyui/number-ticker

Or install the package and import it:

$pnpm add @stacklyui/ui motion

Usage

Format with decimals, locale, and the full Intl.NumberFormat format options, plus prefix/suffix for currency and units. It triggers once when scrolled into view.

Props

PropTypeDefaultDescription
valuenumberThe target value to count to. Required.
fromnumber0Starting value.
durationnumber1.6Seconds for the count.
decimalsnumber0Decimal places to display.
prefix / suffixstringText before/after the number (e.g. "$", "%").
formatIntl.NumberFormatOptionsExtra Intl formatting (e.g. currency style).