1. Home
  2. Docs
  3. Super Elements
  4. Super Elements Modules
  5. Super Counter

Super Counter

Super Counter module is a helpful tool if you want to show the progress of you your task, business, activity. The module is highly customizable with multiple setting parameters.

Super Counter Module Sample

On the picture below you can view Super Countdown Timer module sample.

Content

Display Options

  • Icon Type – Here you will able to select Icon whether it’s font icon or image icon.
  • Select an Icon – If you select font icon previously you will need to select the icon here from the dropdown list of 400+ font icon
  • Icon Size – You will be able to define the size of the font.
  • Counter Title – Here user can define the title of the counter
  • Counter Value – Here use will set the value of Counter.
  • Digits and Title Alignment – User will select the alignment for the counter here.
  • Counter Value Prefix – Here you can input the prefix for the counter.
  • Counter Value Suffix – Here you can input the suffix for the counter.
  • Animation – Here you can select the animation of the There are already 22 premade animation which can be chosen from the dropdown list.
  • Icon Position – Here user will select the position of the icon.

Counter Settings

  • Thousands Separator – Here you can define the separator for thousand. It can be a comma, dot or anything you prefer.
  • Replace Decimal Point – Here user can define the decimal point
  • Digits After Decimal Point – Here user will define the number of digits after the decimal point
  • Counter Rolling Time – Here you can select the counter rolling time.

Style

Icon Style

  • Margin – You can input the values for the headline margins in the required fields.
  • Padding – here you can set the preferable custom padding for the headline. Fill in the values for the top, bottom, right and left padding in pixels to apply your custom padding.
  • Advanced Icon Color – Here you can decorate icon with color, gradient color or image.
  • Icon Color –   Here you can input the color of icon
  • Text Shadow – Here user can select text shadow.
  • Background Type – From Here user can select the type of background whether it will be color, gradient or image.
  • Box Shadow – Here you can add some shadow to the box
  • Width – Here user will select the width of the box
  • Border Type – Here user can select the type of border. The various option is available as like solid, dotted, dashed, groove etc..
  • Width – Here user will select the width of the border.
  • Color – Here user will select the color of the border.
  • Border Radius – Here user will define the radius of the border. It can be pixel or %.

Title

  • Padding – here you can set the preferable custom padding for the headline. Fill in the values for the top, bottom, right and left padding in pixels to apply your custom padding.
  • Advance Title Color – Here you can decorate title with color, gradient color or image.
  • Text Shadow – Here user can select text shadow.
  • Typography – From Here user can select and define the Font family, size, weight, transform, style, decoration, line height, and letter spacing.

Value

  • Padding – here you can set the preferable custom padding for the headline. Fill in the values for the top, bottom, right and left padding in pixels to apply your custom padding.
  • Advance Value Color – Here you can decorate value with color, gradient color or image.
  • Text Shadow – Here user can select text shadow.
  • Typography – From Here user can select and define the Font family, size, weight, transform, style, decoration, line height, and letter spacing.