Number Counter Up Animation with Comma Formatting [1-Minute Webflow Hack]

Learn how to create a dynamic number counting animation with progressive duration and comma formatting for your Webflow project using JavaScript.

Duplicate Webflow:
https://webflow.com/made-in-webflow/website/envision-trial

Duplicate Figma
https://www.figma.com/community/file/1373375441402992043

How this script works:
👉 Processes elements with the numbers_number class on page load.
👉 Animations start when elements come into view (50% visible).
👉 Base duration of 2 seconds, increasing by 0.5 seconds for each subsequent element.
👉 Formats numbers with commas during the animation.
👉 Reattaches leading and trailing non-numeric characters after the animation completes.

0:00 Intro
0:12 How it works
0:50 How to implement it

Скачать видео