Made in Webflow

Odometer Count-Up

site profile thumbnail


Hey Webflow Family, we are back with a new community cloneable for you all. There are many ways to animate numbers, however a flexible solution to also display them like an odometer is very rare. A few days ago we came across Hubspot's Odometer Library and thought this is what the community needs. So here we are, with our Odometer Count-Up Cloneable for you. Some features summarized: 1. count up by 1 in a fixed interval 2. trigger odometer animation on scroll with GSAP scrollTrigger 3. add currency symbol to show prices in an unusual way 4. interval increase by own value 5. interval increment with a randomly generated number in a range 6. show numbers on button click 7. and a bit of educational stuff to understand how you can implement this in your project. Clone it, create with it and have fun with it. Starting today, we will be creating cloneables like this more regularly. :) Be excited. Best regards from Potsdam, Germany Dennis from Vibrand Design
Feeling inspired?If this Made In Webflow site sparked some inspo, why not get started on a project of your own? Clone a site, purchase a template or start building from scratch.

We miss comments too!

Right now, Made in Webflow doesn't offer all of the same functionality that Showcase did, like the ability to leave comments. But don't worry: We're working to bring comments back as soon as possible!

As always, we'd love to hear your feedback! Click the link below to take a short survey about Made in Webflow.

interactioncustom codeodometerclonableanimatenumberscountupcountdownvibranddesignnumber-counter

More by Vibrand Design

See profile
View details
20 CSS Button Hover Styles