Donut Chart


Basic Example

The default appearance of the donut chart.

Course Progress
65%

Small

A smaller version of the chart where the value is displayed to the side.

Course Progress
65%

Small Below

A smaller version of the chart where the value is displayed below the chart.

Course Progress
65%

Neutral Color

The chart can be displayed in a neutral color scheme.

Course Progress
65%

Status Colors

The chart color will change based on the percentage value to indicate status (low, incomplete, complete).

Low (less than 30%)

Course Progress
25%

Incomplete (between 30% and 99%)

Course Progress
75%

Complete (100%)

Course Progress
100%