- Count UP or Count DOWN
- Count once or multiple times
- Count with or without decimals
- Count with or without grouping
- Add a prefix or suffix to your number
- Use custom number characters
- Lots of font options
- Use responsive time delays
- Over 20 easing options
- Works with reduced motion
Count
Add counting effects to your Stacks pages to present your numbers in a more interesting way.
Key Features
Count Up Once
0
Count Down Once
20
Count Every Time
0
Count with Decimals
0.00
Count with Grouping
0.00
Count without Grouping
0.00
Count with Prefix
0.00
Count with Suffix
0.00
With Prefix & Suffix
0.00
Count in Arabic
0.00
Count in Farsi
0.00
Count in Thai
0.00
Variable Fonts
Variable fonts allow you to set the exact font weight in order to get the desired effect.
10 Built-In Variable Fonts
As well as the using the 10 built-in variable fonts, you can use a custom variable font, a custom Google Font, a custom WebFont, or simply inherit the font from the page.
Overview
Count is lightweight, easy to use, and packed with tons of options to animate your numbers. Set the duration, time delay, trigger offset, custom fonts, colors, responsive sizing, and more. Count can be set to trigger once, or trigger every time the number comes into view.
If you need decimals, set how many decimals, and even change the decimal character, and add grouping to a large number, with a choice of grouping characters.
Variable fonts let you set the exact font weight so you number looks great no matter what font size is used. Choose from one of the 10 built-in variable fonts, or upload one of your own. You can also use Google Fonts, custom web fonts, or just inherit the font from the page.
Count has over 20 built-in easing effects to speed up or slow down counting, and comes with smart-easing for larger numbers which lets you set a threshold for when easing should start.
Count can respect the visitors' browser preference for reduced motion, and instead just show the final value without animation.
Count will be supported in the upcoming Stacks 5 App, as well as continued support for Stacks 4 in RapidWeaver 8.
Demo
These numbers are set to trigger only once, and with staggered time delays.
ESSENTIAL DIGITAL HEADLINES
An overview of the adoption and use of connected devices and services
Total
Population
0.00
Billion
Urbanization
0.0
Unique Mobile
Phone Users
0.00
Billion
vs Population
0.0
Internet
Users
0.00
Billion
vs Population
0.0
Active Social
Media Users
0.00
Billion
vs Population
0.0
These numbers are set to trigger every time they come into view.
DIGITAL GROWTH
Change in the use of connected devices and services over time
Total
Population
0.0
Year-on-Year Change
0
Unique Mobile
Phone Users
0.0
Year-on-Year Change
0
Internet
Users
0.0
Year-on-Year Change
0
Active Social
Media Users
0.0
Year-on-Year Change
0.0
incl. 20% VAT
Tutorial
FAQ
Will this stack work on my site? Every effort has been made to ensure that this Stack will work on any Stacks page with any framework or theme. However, if you do have an issue, let us know.
I have another question. You can use the contact form to send us your questions.
Compatibility
RapidWeaver 8
Stacks 4+
Compatible with all major browsers
Safari
Chrome
Firefox
Edge
Opera
Release Notes
Version: 1.0.0
- Initial Release
