<div class="pie-chart" style="
--size: 2em;
--color3: indianred;
--value1: 20%;    
--value2: 10%;    
--value3: 30%;
--value4: 25%;
--value5: 5%;
--background: hsl(220 10% 70%);
"></div>
.pie-chart {
  width: 10em;
  height: 10em;
  padding: calc(var(--size, 15em)  / 2);
  border-radius: 50%;
  
  background: conic-gradient(
    hsl(0 80% 50%)  0 20%,
    hsl(25 80% 50%) 0 30%,
    hsl(50 80% 50%) 0 60%,
    gray 0);
}
View Compiled
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.