diff --git a/components/chef-ui-library/src/charts/chef-radial-chart/chef-radial-chart.tsx b/components/chef-ui-library/src/charts/chef-radial-chart/chef-radial-chart.tsx
index 1ebf46febc42..c88e4719c9e8 100644
--- a/components/chef-ui-library/src/charts/chef-radial-chart/chef-radial-chart.tsx
+++ b/components/chef-ui-library/src/charts/chef-radial-chart/chef-radial-chart.tsx
@@ -27,6 +27,9 @@ let UID = 0;
  *   chef-radial-chart .failed, chef-radial-chart .critical {
  *     color: hsl(var(--chef-critical));
  *   }
+ *   chef-radial-chart .warning, chef-radial-chart .warning {
+ *     color: hsl(var(--chef-primary));
+ *   }
  *   chef-radial-chart .success, chef-radial-chart .major {
  *     color: hsl(var(--chef-success));
  *   }
@@ -38,10 +41,12 @@ let UID = 0;
  *   <span slot="innerText">Text for the center of the chart</span>
  *
  *   <chef-data-point value="4" class="failed">4 Failed</chef-data-point>
- *   <chef-data-point value="3" class="success">3 Successful</chef-data-point>
- *   <chef-data-point value="2" class="skipped">2 Skipped</chef-data-point>
+ *   <chef-data-point value="3" class="warning">3 Warning</chef-data-point>
+ *   <chef-data-point value="2" class="success">2 Successful</chef-data-point>
+ *   <chef-data-point value="1" class="skipped">1 Skipped</chef-data-point>
  *
- *   <chef-data-point value="3" secondary class="critical">Critical</chef-data-point>
+ *   <chef-data-point value="4" secondary class="critical">Critical</chef-data-point>
+ *   <chef-data-point value="3" secondary class="warning">Warning</chef-data-point>
  *   <chef-data-point value="2" secondary class="major">Major</chef-data-point>
  *   <chef-data-point value="1" secondary class="minor">Minor</chef-data-point>
  * </chef-radial-chart>
@@ -51,6 +56,9 @@ let UID = 0;
  *   chef-radial-chart .failed, chef-radial-chart .critical {
  *     color: hsl(var(--chef-critical));
  *   }
+ *   chef-radial-chart .warning, chef-radial-chart .warning {
+ *     color: hsl(var(--chef-primary));
+ *   }
  *   chef-radial-chart .success, chef-radial-chart .major {
  *     color: hsl(var(--chef-success));
  *   }
@@ -62,8 +70,9 @@ let UID = 0;
  *   <span slot="innerText">Text for the center of the chart</span>
  *
  *   <chef-data-point value="4" class="failed">4 Failed</chef-data-point>
- *   <chef-data-point value="3" class="success">3 Successful</chef-data-point>
- *   <chef-data-point value="2" class="skipped">2 Skipped</chef-data-point>
+ *   <chef-data-point value="3" class="warning">3 Warning</chef-data-point>
+ *   <chef-data-point value="2" class="success">2 Successful</chef-data-point>
+ *   <chef-data-point value="1" class="skipped">1 Skipped</chef-data-point>
  * </chef-radial-chart>
  */
 @Component({