loader image

Progress Bars

[vc_row][vc_column][vc_custom_heading text= »Progress Bars Shortcodes » use_theme_fonts= »yes » el_class= »shorter »][vc_column_text]Check out all the progress bars options and can be set in different styles with Visual Composer Progress Bar, Pie Chart shortcodes.[/vc_column_text][vc_separator color= »custom » gap= »tall »][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text= »Default » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][/vc_column][/vc_row][vc_row][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » custombgcolor= »#0088cc »][/vc_column][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » custombgcolor= »#0088cc » units= »% »][/vc_column][vc_column width= »1/3″][vc_progress_bar values= »0″ bgcolor= »custom » animation= » » tooltip= » » custombgcolor= »#0088cc » units= »% » min_width= »2em »][/vc_column][/vc_row][vc_row][vc_column][vc_separator color= »custom » gap= »tall »][vc_custom_heading text= »Contextual classes » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][vc_progress_bar values= »40″ contextual= »success » animation= » » tooltip= » » el_class= »m-b »][vc_progress_bar values= »20″ contextual= »info » animation= » » tooltip= » » el_class= »m-b »][vc_progress_bar values= »60″ contextual= »warning » animation= » » tooltip= » » el_class= »m-b »][vc_progress_bar values= »80″ contextual= »danger » animation= » » tooltip= » » el_class= »m-b »][vc_empty_space height= »20px »][vc_separator color= »custom » gap= »tall »][/vc_column][/vc_row][vc_row][vc_column width= »1/2″][vc_custom_heading text= »Striped » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][vc_progress_bar values= »40″ bgcolor= »custom » options= »striped » animation= » » tooltip= » » custombgcolor= »#0088cc »][/vc_column][vc_column width= »1/2″][vc_custom_heading text= »Animated » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][vc_progress_bar values= »40″ bgcolor= »custom » options= »striped,animated » animation= » » tooltip= » » custombgcolor= »#0088cc »][/vc_column][/vc_row][vc_row][vc_column][vc_separator color= »custom » gap= »tall »][vc_custom_heading text= »Border Radius » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][/vc_column][/vc_row][vc_row][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » border_radius= »no-border-radius » custombgcolor= »#0088cc » border= »rect »][/vc_column][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » border_radius= »border-radius » border= »round » custombgcolor= »#0088cc »][/vc_column][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » border_radius= »circled-border-radius » border= »circle » custombgcolor= »#0088cc »][/vc_column][/vc_row][vc_row][vc_column][vc_separator color= »custom » gap= »tall »][vc_custom_heading text= »Sizes » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][/vc_column][/vc_row][vc_row][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » size= »sm » custombgcolor= »#0088cc » border= »rect »][/vc_column][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » border= »round » custombgcolor= »#0088cc »][/vc_column][vc_column width= »1/3″][vc_progress_bar values= »60″ bgcolor= »custom » animation= » » tooltip= » » size= »lg » border= »circle » custombgcolor= »#0088cc »][/vc_column][/vc_row][vc_row][vc_column][vc_separator color= »custom » gap= »tall »][/vc_column][/vc_row][vc_row][vc_column width= »1/2″][vc_custom_heading text= »Animated & Tooltips » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][vc_progress_bar values= »100|HTML/CSS,85|Design,75|WordPress,85|Photoshop » bgcolor= »custom » custombgcolor= »#0088cc » units= »% »][/vc_column][vc_column width= »1/2″][vc_custom_heading text= »Colors » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][vc_progress_bar values= »50|Primary » bgcolor= »custom » custombgcolor= »#0088cc » units= »% » el_class= »m-b »][vc_progress_bar values= »70|Secondary » bgcolor= »custom » custombgcolor= »#e36159″ units= »% » el_class= »m-b »][vc_progress_bar values= »75|Tertiary » bgcolor= »custom » custombgcolor= »#2baab1″ units= »% » el_class= »m-b »][vc_progress_bar values= »40|Quaternary » bgcolor= »custom » custombgcolor= »#383f48″ units= »% »][/vc_column][/vc_row][vc_row][vc_column][vc_separator color= »custom » gap= »tall »][vc_custom_heading text= »Circular » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][/vc_column][/vc_row][vc_row][vc_column width= »1/3″][vc_pie value= »75″ size= »175″ speed= »2500″ line= »14″ units= »% » barcolor= »#0088cc » title= »HTML/CSS »][/vc_column][vc_column width= »1/3″][vc_pie value= »55″ view= »only-icon » size= »175″ speed= »2500″ line= »14″ barcolor= »#0088cc » title= »HTML/CSS » icon= »fa fa-star »][/vc_column][vc_column width= »1/3″][vc_pie value= »58″ view= »single-line » size= »175″ speed= »2500″ line= »14″ barcolor= »#0088cc » title= »HTML/CSS »][/vc_column][/vc_row][vc_row][vc_column][vc_separator color= »custom » gap= »tall »][vc_custom_heading text= »Sizes » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][/vc_column][/vc_row][vc_row][vc_column width= »1/3″][vc_pie value= »75″ view_size= »sm » size= »85″ speed= »2500″ line= »3″ units= »% » barcolor= »#0088cc »][/vc_column][vc_column width= »1/3″][vc_pie value= »75″ size= »175″ speed= »2500″ line= »14″ units= »% » barcolor= »#0088cc » title= »HTML/CSS »][/vc_column][vc_column width= »1/3″][vc_pie value= »75″ view_size= »lg » size= »250″ speed= »2500″ line= »14″ units= »% » barcolor= »#0088cc » title= »HTML/CSS »][/vc_column][/vc_row][vc_row][vc_column][vc_separator color= »custom » gap= »tall »][vc_custom_heading text= »Options » font_container= »tag:h4|text_align:left » use_theme_fonts= »yes »][/vc_column][/vc_row][vc_row][vc_column width= »1/3″][vc_pie value= »75″ size= »175″ speed= »2500″ line= »3″ linecap= »square » units= »% » barcolor= »#0088cc » title= »HTML/CSS »][/vc_column][vc_column width= »1/3″][vc_pie value= »75″ size= »175″ speed= »2500″ line= »14″ linecap= »square » units= »% » barcolor= »#0088cc » title= »HTML/CSS »][/vc_column][vc_column width= »1/3″][vc_pie value= »75″ size= »175″ speed= »2500″ line= »14″ linecap= »square » units= »% » barcolor= »#0088cc » title= »HTML/CSS » scalecolor= »#999999″][/vc_column][/vc_row]