How to set up and style the Counter widget in Elementor.
Counter animates a number from a start value to an end value the first time it scrolls into view. It can show an icon, a prefix, a suffix and a title, and it formats large numbers with a thousands separator. Use it for stats such as clients served, years in business or projects done.
Part of: Bright Addons (free).
| Option | What it does |
|---|---|
| Icon | An optional icon shown above the number. |
| Start Number | The value the animation starts from. The default is 0. |
| End Number | The value the animation ends on. The default is 1250. |
| Decimal Places | How many decimals to show, from 0 to 4. |
| Prefix | Text printed right before the number. |
| Suffix | Text printed right after the number. The default is a plus sign. |
| Thousands Separator | Chooses None, Comma, Dot or Space to group thousands. |
| Animation Duration (ms) | How long the count takes. The default is 2000. |
| Title | The label under the number. |
| Title Tag | Sets the tag used for the title. The default is div. |
| Alignment | Aligns the counter left, center or right, per device. |
Pro adds 77 widgets, 10 extensions, a Theme Builder and 32 dynamic tags, and keeps every free widget. From $16 a year, with a 14-day money-back guarantee.
These sections are in the Style tab.
background color, padding, border, border radius and box shadow.
color, typography, spacing under the number and a separate Prefix and Suffix Color.
color and typography.
color, size and spacing under the icon (shown when an icon is chosen).
It starts when the number scrolls into view, not on page load, so visitors see the animation.
Yes. Type it in Prefix or Suffix. Both are printed tight against the number with no gap.
Yes. Set Decimal Places from 0 to 4 and type the End Number with decimals.
No. It animates once, the first time it comes into view.
Check the troubleshooting guide, or contact support with the page address and what you expected to happen.
Troubleshooting guide