Counter blocks
Number tickers, split-flap counters, count-up-with-pulse.
Counts up from 0 (or a custom start value) to a target number when scrolled into view, supports decimals via decimalPlaces. Standard for a stats row (customers served, uptime %, dollars saved). Trigger once per view, do not loop.
Circular gauge that animates its fill to a target percentage, useful for a skills/completion widget or a dashboard KPI card. Set gaugePrimaryColor to the brand accent so it does not default to indigo.
Four-stat row that counts up from zero when it scrolls into view, using IntersectionObserver plus requestAnimationFrame, no animation library needed. Swap the data-target/prefix/suffix attributes per stat, keep to four items or the row gets cramped on mobile.
Number eases from 0 to target with ease-out. Nav uses it for revenue and views — the resting state is the final number, so noscript readers see the truth.
Airport-departure-board style. Each digit rolls independently — slower feel than the eased counter, better for showy stats.
Combines count-up 05 with Nav's `countpulse` — the number scales 6% when it lands, giving the arrival a small pop the eye catches. Reads more 'alive' than eased-only. Use for hero stats and social proof.
Want your site’s counter blocks to look this good?
We build full sites with blocks like these.