Pie chart
shortcode

Present the colored diagrams in a simple and clear way. Add the icons to make to pie charts noticeable and informative.
Read documentation
Usage frequency
70%
Preset amount
75%
Customizability
89%

Available options

Default code: [dfd_piecharts percent="75" size="160" fill_width="7" bg_width="1" main_style="style-1"]

Style – Choose between 4 preset styles;

Number – Define the pie chart value;

Measuring unit – Set the measuring units you’d like to display in the pie chart;

Circle size – Allows you to set the size of the pie chart circle;

Circle animation – This option allows you to enable or disable the animation for the pie chart;

Anticlockwise – Allows you to change the direction for the animation;

Animation – Choose between 14 preset animation effects;

Custom CSS Class – Type your own unique class name for the item – this is a useful option for those who want to create a specific style.
For example, you can type custom-style class and then go to Theme options -> General Options -> Custom CSS / JS -> Custom CSS and write your own CSS code with this class to get your own style;

Content – Specify the title and the subtitle for the pie chart;

Icon – This option allows you to enable or disable the icon for the pie chart and customize it;

Circle gradient – Allows you to set the colors for the pie chart;

Border style – Customize the border for the pie chart;

Typography – Select letter spacing, font size and element tag. You can also choose the custom font family.

Default styles

Samples of preset styles without custom changes
simple style
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
icon inside style
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
icon near title style
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
number near title style
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle

Customized styles

Some variations of style customizations of the shortcode
custom colors
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle
0
Pie chart title
Pie chart subtitle