Number Counter module overview

The Number Counter module displays a number in an animated fashion, with the counter going from zero to the number or percent you specify.

You can configure the Number Counter module in many different ways, as you can see in this screenshot.

  • Display options include a circle, a horizontal bar, or just the number.
  • The number can be displayed as a percent or standard (an absolute value).
  • Standard numbers, can include a prefix (such as the dollar sign) or a suffix to the number.
  • With a standard number in the horizontal bar display, you can choose the maximum number for the total bar length, as well as the counter number. In the turquoise bars in the screenshot, the maximum number was set to 317.
  • Text can be displayed over or under the number, or not at all.
  • You can specify colors for the counter and text, and you can change the animation speed for the counter.

Number counters are most often used to compare two or more numbers. Just add a Number Counter module for each number in the layout you want. Here are the same four Number Counter modules moved into a different layout:

Here is a live example of a circle number counter: