Circle Charts & Skill Bars

[title type=”special-h4-left”]Circle Charts[/title]
[row]

[column size=”col-4″]

[circle_chart type=”with-icon” color=”#c0392b” track_color=”#e1e1e1″ weight=”3″ icon=”hb-moon-meter-fast” percent=”60″ caption=”60% Faster” animation_speed=”300″ animation=”top-to-bottom”]

[/column]

[column size=”col-4″]

[circle_chart type=”with-icon” color=”#2c3e50″ track_color=”#e1e1e1″ weight=”3″ icon=”hb-moon-cogs” percent=”80″ caption=”80% More Powerful” animation_speed=”600″ animation=”top-to-bottom”]

[/column]

[column size=”col-4″]

[circle_chart type=”with-icon” weight=”3″ icon=”hb-moon-quill-2″ percent=”90″ caption=”90% Lighter” animation_speed=”1200″ animation=”top-to-bottom”]

[/column]

[/row]

[spacer]

[row]

[column size=”col-4″]

[circle_chart type=”with-percent” percent=”80″ color=”#2c3e50″ track_color=”#e1e1e1″ weight=”8″ icon=”hb-moon-cogs” percent=”80″ caption=”With Percents” animation_speed=”600″ animation=”top-to-bottom”]

[/column]

[column size=”col-4″]

[circle_chart type=”with-text” text=”Text?” color=”#8e44ad” track_color=”#e1e1e1″ weight=”3″ percent=”50″ caption=”Yes! Use Text” animation_speed=”900″ animation=”top-to-bottom”]

[/column]

[column size=”col-4″]

[circle_chart type=”with-icon” color=”#8e44ad” track_color=”#e1e1e1″ weight=”1″ icon=”hb-moon-health” percent=”75″ caption=”Line Weight” animation_speed=”900″ animation=”top-to-bottom”]

[/column]

[/row]

[spacer height=”50px”]
[title type=”special-h4-left”]Skill Bars[/title]
[spacer height=”30px”]

[row]
[column size=”col-6″]
[skill number=”90″ char=”%” caption=”WordPress”]
[skill number=”80″ char=”%” caption=”PHP”]
[skill number=”70″ char=”%” caption=”Java”]
[skill number=”60″ char=”%” caption=”Ruby”]
[skill number=”50″ char=”%” caption=”Python”]
[/column]
[column size=”col-6″]
[skill number=”75″ char=”%” caption=”WordPress” color=”#2980b9″]
[skill number=”53″ char=”%” caption=”PHP” color=”#c0392b”]
[skill number=”66″ char=”%” caption=”Java” color=”#d35400″]
[skill number=”95″ char=”%” caption=”Ruby” color=”#8e44ad”]
[skill number=”40″ char=”%” caption=”Python” color=”#27ae60″]
[/column]
[/row]

[spacer height=”50px”]

[title type=”special-h4-left”]Get the code[/title]
[title type=”subtitle-h6″]Paste in Text Editor[/title]

[content_box type=”without-header” color=”#FFFFFF” class=”pre-text”]

[skill number=”75″ char=”%” caption=”WordPress” color=”#2980b9″]

[/content_box]

[info_message style=”info”]1. You can also use these shortcodes as Visual Composer Drag & Drop elements.
If you prefer shortcodes, you can generate them using Shortcode Generator.

2. Visit Theme Documentation for available arguments and more information. View Documentation Now.
[/info_message]