Progress Bars, Counters and Circles Elements

Doodle includes multiple animated counter elements, including the progress bar and counters. These are great for displaying varying types of data and content to your viewers. The progress bar include several options for easy customization and is a great way to visually attract the viewer and display content.

Users That Recommend Us 94%

Progress Bar Elements

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud consequat.

Our Skills 85%
Our Skills 90%
Our Skills 85%

Control Colors

Each progress bar can have a different filled / unfilled color and text color.
Marketing Strategy 95%
Customers Referred Daily 80%
Repeat Business From Clients 85%

Animated Striped Bars

Each progress bar can have a striped or solid fill, and the stripes can animate.
Solid Progress Bar 80%
Striped Progress Bar 85%
Animated Striped Progress Bar 95%

Unit Control

Each progress bar can have a different unit symobl, or left empty for no unit.
Progress Bar With Different Unit 80 Million AUD
Progress Bar With No Unit 80

Counter Circle Elements

Doodle includes multiple animated counter elements, including the counter circle element. These are great for displaying varying types of data to your viewers. The counter circles have several options that allow you to easily customize them to your needs. Wether its sales percentages, skill levels, promotional levels or other data sets, the counter circle element is a great way to visually attract the viewer and display content. The Counter Circle Element Is Highly Customizable: Customization options for circle size, filled and unfilled colour, scales, speed, counting direction and more!

Circle
94%
Users
Love
Doodle

Control Colours

Each counter circle in the element can have a different filled and unfilled colour.
Full
Control
of
Colours

Control Size

Each counter circle in the element can have a different circle diameter.
You
Can
Control
The
Circle
Size

Show Scales

Each counter circle can display a set of scales which visually mark the values around the circle. Larger scales mark it the quarter values around the circle.
Show
Some
Scales

Count Up or Down

Each counter circle in the element can have the filled animation start full (up) or empty (down).
Up
Down

Animation Speed

Each counter circle in the element can have a different animation speed, which provides a visual variation.
You
Control
The
Circle
Speed

Font Awesome Icons

Each counter circle can have text information or a font awesome icon inside the circle. The full font awesome element can be used along with all of the icon options.

Counter Box element

Doodle includes multiple animated counter elements, including the counter box element. These are great for displaying varying types of data and content to your viewers. The counter boxes include several options for easy customization and is a great way to visually attract the viewer and display content. The Counter BoxElement Is Highly Customizable

0%
Text here

Control Colours

Each counter box can have a different colour for the text and icon.
0%
90% of Designers Use Macintosh
0%
75% of People Love iPhones

Column Options

Each counter box instance has an option for selecting column width.
0+ Users
Choose From 1-4 Columns For The Counter Boxes

Unit Control

Each counter box instance can have a different unit and unit position
$0
Use Any Symbol Or Custom Text For The Unit
0%
Use Any Symbol Or Custom Text For The Unit
0 lbs
Use Any Symbol Or Custom Text For The Unit

Count Up or Down

Each counter box can have the animation number start up or down
$0
Set The Counter To Count Up
$1000
Set The Counter To Count Down

Font Awesome Icons

Each counter box instance can display a font awesome icon with the content.
0+ Vector Icons
Use Any of The Font Awesome Icons

Border Control

Each counter box instance can display a border around the box.
$0
This Counter Box Displays No Border.
$0
This Counter Box Displays No Border.