Roll Animated Number

Roll Animated Number
Roll Animated Number

About Roll Animated Number

A slot-machine style number counter for Framer — rolls each digit into place when it enters the viewport, then locks in cleanly. Works out of the box, but every visual detail is yours to tune.

Features:

  • Two sizing modes: Fluid (scales smoothly with its container — great for big display numbers) or Fixed (a precise pixel size — great for stat labels and compact UI)

  • Any font in your project via Framer's native font control, including weight, style, and letter spacing

  • Spring-based roll animation with adjustable duration, stagger (delay between digits), and bounce (from a clean stop to a springy overshoot)

  • Auto-expanding digit count with a configurable minimum (e.g. always show at least 2 digits, padded with zeros)

  • Full control over color, digit width, and line height for precise fine-tuning

  • No code required — everything is exposed in the properties panel

Perfect for stats sections, KPI displays, pricing counters, or any number you want to feel alive instead of just appearing.

Live demo

Related Components

3D Viewer
Chrome Dino Game
AI Chat Prompt
Physics Tooltip