Progress Bars

[av_heading tag=’h1′ padding=’15’ heading=’Progress Bar Element’ color=’custom-color-heading’ style=’blockquote modern-quote’ custom_font=’#000000′ size=’40’ subheading_active=” subheading_size=’15’ custom_class=” admin_preview_bg=”][/av_heading]

[av_textblock size=” font_color=” color=” admin_preview_bg=”]
Add any number of progress bars in various predefined colors, either with or without icon, with or without description.
Perfect if you want to display some progress or display a skill you or your company has mastered and how good you are at it.
[/av_textblock]

[av_hr class=’invisible’ height=’50’ shadow=’no-shadow’ position=’center’ custom_border=’av-border-thin’ custom_width=’50px’ custom_border_color=” custom_margin_top=’30px’ custom_margin_bottom=’30px’ icon_select=’yes’ custom_icon_color=” icon=’ue808′ font=’entypo-fontello’ admin_preview_bg=”]

[av_heading heading=’Progress Bar Minimal’ tag=’h1′ style=’blockquote modern-quote’ size=’30’ subheading_active=” subheading_size=’15’ padding=’15’ color=’custom-color-heading’ custom_font=’#000000′ admin_preview_bg=”][/av_heading]

[av_progress bar_styling=’av-flat-bar’ bar_animation=’av-animated-bar’ bar_styling_secondary=’av-small-bar’ show_percentage=’av-show-bar-percentage’ admin_preview_bg=”]
[av_progress_bar title=’BAR 1′ progress=’100′ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’BAR 2′ progress=’91’ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’BAR 3′ progress=’78’ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’BAR 4′ progress=’23’ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[/av_progress]

[av_hr class=’invisible’ height=’50’ shadow=’no-shadow’ position=’center’ custom_border=’av-border-thin’ custom_width=’50px’ custom_border_color=” custom_margin_top=’30px’ custom_margin_bottom=’30px’ icon_select=’yes’ custom_icon_color=” icon=’ue808′ font=’entypo-fontello’ admin_preview_bg=”]

[av_heading heading=’Progress Bar Minimal Animated’ tag=’h1′ style=’blockquote modern-quote’ size=’30’ subheading_active=” subheading_size=’15’ padding=’15’ color=’custom-color-heading’ custom_font=’#000000′ admin_preview_bg=”][/av_heading]

[av_progress bar_styling=’av-striped-bar’ bar_animation=’av-animated-bar’ bar_styling_secondary=’av-small-bar’ show_percentage=’av-show-bar-percentage’ bar_height=’5′ admin_preview_bg=”]
[av_progress_bar title=’BAR 1′ progress=’100′ color=’silver’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’BAR 2′ progress=’91’ color=’silver’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’BAR 3′ progress=’78’ color=’silver’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’BAR 4′ progress=’23’ color=’silver’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[/av_progress]

[av_hr class=’invisible’ height=’50’ shadow=’no-shadow’ position=’center’ custom_border=’av-border-thin’ custom_width=’50px’ custom_border_color=” custom_margin_top=’30px’ custom_margin_bottom=’30px’ icon_select=’yes’ custom_icon_color=” icon=’ue808′ font=’entypo-fontello’ admin_preview_bg=”]

[av_heading tag=’h1′ padding=’15’ heading=’Progress Bar Big’ color=’custom-color-heading’ style=’blockquote modern-quote’ custom_font=’#000000′ size=’30’ subheading_active=” subheading_size=’15’ custom_class=” admin_preview_bg=”][/av_heading]

[av_progress bar_styling=’av-flat-bar’ bar_animation=’av-animated-bar’ admin_preview_bg=”]
[av_progress_bar title=’1′ progress=’100′ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’2′ progress=’91’ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’3′ progress=’78’ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[av_progress_bar title=’4′ progress=’23’ color=’blue’ icon_select=’no’ icon=’43’ font=’entypo-fontello’]
[/av_progress]

[av_hr class=’invisible’ height=’50’ shadow=’no-shadow’ position=’center’ custom_border=’av-border-thin’ custom_width=’50px’ custom_border_color=” custom_margin_top=’30px’ custom_margin_bottom=’30px’ icon_select=’yes’ custom_icon_color=” icon=’ue808′ font=’entypo-fontello’ admin_preview_bg=”]

[av_heading tag=’h1′ padding=’15’ heading=’Animated Progress Bar Examples’ color=’custom-color-heading’ style=’blockquote modern-quote’ custom_font=’#000000′ size=’30’ subheading_active=” subheading_size=’15’ custom_class=” admin_preview_bg=”][/av_heading]

[av_progress bar_styling=’av-striped-bar’ bar_animation=’av-animated-bar’]
[av_progress_bar title=’HTML’ progress=’100′ color=’theme-color’ icon_select=’no’ icon=’43’]
[av_progress_bar title=’CSS’ progress=’50’ color=’grey’ icon_select=’no’ icon=’58’]
[av_progress_bar title=’Javascript’ progress=’20’ color=’silver’ icon_select=’no’ icon=”]
[av_progress_bar title=’Video’ progress=’30’ color=’blue’ icon_select=’no’ icon=”]
[av_progress_bar title=’Flash’ progress=’70’ color=’green’ icon_select=’yes’ icon=’64’]
[av_progress_bar title=’Photoshop’ progress=’80’ color=’orange’ icon_select=’no’ icon=”]
[av_progress_bar title=’After Effects’ progress=’20’ color=’red’ icon_select=’no’ icon=”]
[av_progress_bar title=’Premiere’ progress=’60’ color=’aqua’ icon_select=’no’ icon=”]
[av_progress_bar title=’Dreamweaver’ progress=’95’ color=’teal’ icon_select=’no’ icon=”]
[av_progress_bar title=’Illustrator’ progress=’40’ color=’purple’ icon_select=’yes’ icon=’50’]
[av_progress_bar title=” progress=’30’ color=’pink’ icon_select=’no’ icon=”]
[av_progress_bar title=’Unagi’ progress=’10’ color=’black’ icon_select=’yes’ icon=’14’]
[/av_progress]

Scroll to Top