Progress bars and Skill meter

[vc_row][vc_column width= »1/1″][mk_fancy_title tag_name= »h2″ style= »false » color= »#333333″ size= »24″ font_weight= »bold » txt_transform= »uppercase » letter_spacing= »1″ margin_top= »40″ margin_bottom= »0″ align= »center »]Progress bars. Beautiful & customizable.[/mk_fancy_title][mk_divider style= »thin_solid » divider_width= »custom_width » custom_width= »25″ align= »center » border_color= »#f97352″ thickness= »3″ margin_top= »15″ margin_bottom= »35″][vc_row_inner][vc_column_inner width= »1/6″][/vc_column_inner][vc_column_inner width= »2/3″][vc_column_text disable_pattern= »false » align= »center » margin_bottom= »0″]All progress bars are customizable. Change color, thickness and size of each bar. 3 type of bars. With percentage, with custom text and with icon inside. Animated contents are available.[/vc_column_text][/vc_column_inner][vc_column_inner width= »1/6″][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row fullwidth= »true » attached= »false » padding= »0″][vc_column width= »1/1″][mk_divider divider_width= »full_width » custom_width= »10″ align= »center » border_color= »#ebebeb » thickness= »1″ margin_top= »30″ margin_bottom= »70″ style= »thin_solid »][/vc_column][/vc_row][vc_row][vc_column width= »1/4″ el_position= »first »][mk_chart percent= »20″ bar_color= »#f97352″ track_color= »#ebebeb » line_width= »22″ bar_size= »220″ content_type= »icon » icon= »mk-moon-guitar » desc= »Chart with icon » width= »1/1″ el_position= »first last » icon_size= »50″ icon_color= »#f97352″ percentage_text_size= »15″ percentage_color= »#444444″][/vc_column][vc_column width= »1/4″][mk_chart percent= »40″ bar_color= »#f97352″ track_color= »#ebebeb » line_width= »16″ bar_size= »220″ content_type= »icon » icon= »mk-li-pencil » desc= »Chart with icon » width= »1/1″ el_position= »first last » icon_size= »50″ icon_color= »#444444″ percentage_text_size= »15″ percentage_color= »#444444″][/vc_column][vc_column width= »1/4″][mk_chart percent= »60″ bar_color= »#f97352″ track_color= »#ebebeb » line_width= »8″ bar_size= »220″ content_type= »percent » icon= »mk-moon-guitar » desc= »Chart with Percentage » width= »1/1″ el_position= »first last » icon_size= »32″ icon_color= »#444444″ percentage_text_size= »16″ percentage_color= »#444444″][/vc_column][vc_column width= »1/4″][mk_chart percent= »80″ bar_color= »#f97352″ track_color= »#ebebeb » line_width= »2″ bar_size= »220″ content_type= »custom_text » icon= »mk-moon-guitar » desc= »Chart with icon » width= »1/1″ el_position= »first last » custom_text= »CUSTOM TEXT » icon_size= »32″ icon_color= »#444444″ percentage_text_size= »15″ percentage_color= »#444444″][/vc_column][/vc_row][vc_row fullwidth= »true »][vc_column width= »1/1″][mk_padding_divider size= »100″][/vc_column][/vc_row][vc_row][vc_column width= »1/2″ el_position= »first »][mk_fancy_title tag_name= »h2″ style= »false » color= »#333333″ size= »16″ font_weight= »bold » txt_transform= »uppercase » letter_spacing= »1″ margin_top= »60″ margin_bottom= »0″ align= »left »]Diagram progress bar[/mk_fancy_title][mk_divider style= »thin_solid » divider_width= »custom_width » custom_width= »30″ align= »left » border_color= »#f97352″ thickness= »3″ margin_top= »10″ margin_bottom= »35″][vc_column_text disable_pattern= »false » align= »left » margin_bottom= »0″ p_margin_bottom= »0″ width= »1/1″ el_position= »first last »]Praesent mi risus, fringilla et congue a, adipiscing a justo. Etiam non nulla libero. Proin vitae feugiat ante. In semper dignissim rutrum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut vitae nulla in dui ullamcorper molestie ac at eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae. Nulla non semper enim, et ultrices dui. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer et lacus sit amet ante ornare adipiscing sed in ligula. Donec scelerisque quis risus in suscipit. Nam quis mi in lorem egestas ultricies. Aenean aliquam quam ut ante feugiat pulvinar.

[/vc_column_text][/vc_column][vc_column width= »1/2″ el_position= »last »][mk_padding_divider size= »60″][mk_skill_meter_chart title= »Skills » percent_1= »90″ color_1= »#f97352″ name_1= »Photoshop » percent_2= »85″ color_2= »#fa8f75″ name_2= »CSS » percent_3= »76″ color_3= »#fba995″ name_3= »PHP » percent_4= »45″ color_4= »#fcc0b1″ name_4= »Copywriting » percent_5= »38″ percent_6= »0″ percent_7= »0″ default_text= »SKILLS » center_color= »#3d4045″ default_text_color= »#ffffff » animation= »bottom-to-top » width= »1/1″ el_position= »first last »][/vc_column][/vc_row][vc_row fullwidth= »true »][vc_column width= »1/1″][mk_padding_divider size= »70″][/vc_column][/vc_row][vc_row fullwidth= »false » attached= »true » padding= »3″][vc_column width= »1/2″][mk_skill_meter title= »PHOTOSHOP » percent= »90″ color= »#f97352″ width= »1/1″ el_position= »first last » line_height= »35″ percent_color= »rgba(0,0,0,0.5) » bar_color= »rgba(0,0,0,0.12) »][mk_skill_meter title= »ILLUSTRATOR » percent= »80″ color= »#f97352″ width= »1/1″ el_position= »first last »][mk_skill_meter title= »JAVASCRIPT » percent= »70″ color= »#f97352″ width= »1/1″ el_position= »first last » line_height= »22″ percent_color= »rgba(0,0,0,0.5) » bar_color= »rgba(0,0,0,0.12) »][mk_skill_meter title= »HTML » percent= »60″ color= »#f97352″ width= »1/1″ el_position= »first last » line_height= »22″ percent_color= »rgba(0,0,0,0.5) » bar_color= »rgba(0,0,0,0.12) »][mk_skill_meter title= »AFTER EFFECT » percent= »50″ color= »#f97352″ width= »1/1″ el_position= »first last »][mk_skill_meter title= »COPYWRITING » percent= »40″ color= »#f97352″ width= »1/1″ el_position= »first last » line_height= »22″ percent_color= »rgba(0,0,0,0.5) » bar_color= »rgba(0,0,0,0.12) »][mk_skill_meter title= »DROPBOX » percent= »30″ color= »#f97352″ width= »1/1″ el_position= »first last » line_height= »14″ percent_color= »rgba(0,0,0,0.5) » bar_color= »rgba(0,0,0,0.12) »][mk_skill_meter percent= »20″ color= »#f97352″ width= »1/1″ el_position= »first last » line_height= »8″ percent_color= »rgba(0,0,0,0.5) » bar_color= »rgba(0,0,0,0.12) » title= »PHP »][mk_skill_meter title= »MEDIA » percent= »10″ color= »#a5a5a5″ width= »1/1″ el_position= »first last » line_height= »5″ percent_color= »#f97352″ bar_color= »rgba(0,0,0,0.12) »][mk_skill_meter title= »OS » percent= »5″ color= »#a5a5a5″ width= »1/1″ el_position= »first last » line_height= »1″ percent_color= »#f97352″ bar_color= »rgba(0,0,0,0.12) »][/vc_column][vc_column width= »1/2″][mk_fancy_title tag_name= »h2″ style= »false » color= »#333333″ size= »16″ font_weight= »bold » txt_transform= »uppercase » letter_spacing= »1″ margin_top= »0″ margin_bottom= »0″ align= »left »]Skill bars[/mk_fancy_title][mk_divider style= »thin_solid » divider_width= »custom_width » custom_width= »30″ align= »left » border_color= »#f97352″ thickness= »3″ margin_top= »10″ margin_bottom= »35″][vc_column_text disable_pattern= »false » align= »left » margin_bottom= »0″ p_margin_bottom= »0″ width= »1/1″ el_position= »first last »]Praesent mi risus, fringilla et congue a, adipiscing a justo. Etiam non nulla libero. Proin vitae feugiat ante. In semper dignissim rutrum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut vitae nulla in dui ullamcorper molestie ac at eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae. Nulla non semper enim, et ultrices dui. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer et lacus sit amet ante ornare adipiscing sed in ligula. Donec scelerisque quis risus in suscipit. Nam quis mi in lorem egestas ultricies. Aenean aliquam quam ut ante feugiat pulvinar.

[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column width= »1/1″][mk_padding_divider size= »70″][/vc_column][/vc_row]