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.
[mk_fancy_title tag_name=”h1″ size=”32″ font_weight=”bold” txt_transform=”capitalize” margin_top=”60″ margin_bottom=”35″ font_family=”none” align=”center”]Diagram Progress Bars – Skill Meter[/mk_fancy_title][mk_image src=”https://speaktechnique.ca/wp-content/uploads/2014/08/divider-01.svg” image_size=”full” align=”center” margin_bottom=”35″]
[mk_chart percent=”20″ track_color=”#ebebeb” line_width=”22″ bar_size=”220″ content_type=”icon” icon=”mk-moon-guitar” icon_size=”50″ icon_color=”#9492f5″ desc=”Customize Icon Color ” width=”1/1″ el_position=”first last”]
[mk_chart percent=”60″ track_color=”#ebebeb” line_width=”16″ bar_size=”220″ content_type=”icon” icon=”mk-li-pencil” icon_size=”50″ icon_color=”#444444″ desc=”Icon” desc_color=”#444444″ width=”1/1″ el_position=”first last”]
[mk_chart percent=”60″ track_color=”#ebebeb” line_width=”8″ bar_size=”220″ percentage_text_size=”16″ percentage_color=”#444444″ desc=”Percentage ” width=”1/1″ el_position=”first last”]
[mk_chart percent=”80″ track_color=”#ebebeb” line_width=”2″ bar_size=”220″ content_type=”custom_text” custom_text=”Custom Text” desc=”Text” width=”1/1″ el_position=”first last”]
[mk_padding_divider size=”100″]
[mk_fancy_title color=”#333333″ size=”16″ font_weight=”bold” txt_transform=”capitalize” letter_spacing=”1″ margin_top=”60″ font_family=”none”]diagram progress bar[/mk_fancy_title]
Praesent mi risus, fringilla et congue adipiscing 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 ullam corper molestie ac at eros estibulum 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 onec scelerisque quis risus in suscipit nam quis mi in lorem egestas ultricies. Aenean aliquam quam ut ante feugiat pulvinar.
Ut vitae nulla in dui ullam corper 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.
[mk_padding_divider size=”60″][mk_skill_meter_chart 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″ color_6=”” color_7=”” default_text=”Skills” center_color=”#3d4045″ default_text_color=”#ffffff” animation=”right-to-left” title=”Skills” width=”1/1″ el_position=”first last”]
[mk_padding_divider size=”70″]
[mk_skill_meter title=”PHOTOSHOP” percent=”90″ line_height=”35″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”ILLUSTRATOR” percent=”80″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”JAVASCRIPT” percent=”70″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”HTML” percent=”60″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”AFTER EFFECT” width=”1/1″ el_position=”first last”][mk_skill_meter title=”COPYWRITING” percent=”40″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”DROPBOX” percent=”30″ line_height=”14″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”PHP” percent=”20″ line_height=”8″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”MEDIA” percent=”10″ line_height=”5″ percent_color=”#9492f5″ color=”#a5a5a5″ width=”1/1″ el_position=”first last”][mk_skill_meter title=”OS” percent=”5″ line_height=”1″ percent_color=”#9492f5″ color=”#a5a5a5″ width=”1/1″ el_position=”first last”]
[mk_fancy_title color=”#333333″ size=”16″ font_weight=”bold” txt_transform=”capitalize” letter_spacing=”1″ font_family=”none”]skill bar[/mk_fancy_title]
Praesent mi risus, fringilla et congue adipiscing 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 ullam corper molestie ac at eros estibulum 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 onec scelerisque quis risus in suscipit nam quis mi in lorem egestas ultricies. Aenean aliquam quam ut ante feugiat pulvinar.
Ut vitae nulla in dui ullam corper 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.
[mk_padding_divider size=”80″]
[mk_padding_divider size=”50″]
[mk_fancy_title color=”#ffffff” size=”22″ font_weight=”bold” txt_transform=”none” margin_top=”15″ font_family=”none”]Jupiter is your last WordPress theme ever.[/mk_fancy_title]
[mk_button dimension=”flat” corner_style=”rounded” size=”large” icon=”mk-moon-download” icon_anim=”vertical” url=”https://themeforest.net/item/jupiter-multipurpose-responsive-theme/5177775?ref=artbees&utm_source=V6demopagesGeneralFooterCTA” target=”_blank” align=”right” margin_right=”0″ el_class=”download-footer” bg_color=”#9492f5″ btn_hover_bg=”#8885dd”]DOWNLOAD NOW[/mk_button]
[mk_divider style=”thin_solid” thin_single_color=”rgba(255,255,255,0.1)”]