Simple Pie Chart with HTML and CSS

<style>
.pie {
     /* Basic layout */
     display: inline-block;
     width: 10em;
     height: 10em;
     border-radius: 50%;

     /* A little styling */
     border: .15em solid #fff;
     box-shadow: 0 .075em .2em .05em rgba(0,0,0,.25);

     /* fixes a minor clipping issue in Chrome */
     background-origin: border-box;
   }

.pie {
  background-image: conic-gradient(
    #d44 calc(3.6deg * var(--segment1)),
    #fc3 0 calc(3.6deg * var(--segment2)),
    #ac0 0
  );
}
</style>

<div class="pie" style="--segment1: 40; --segment2: 70;"></div>
<div class="pie" style="--segment1: 20; --segment2: 50;"></div>
<div class="pie" style="--segment1: 10; --segment2: 80;"></div>

Save this code into a .html file, open in your browser and see what is does, you have now 3 pie charts
only with HTML and CSS Code.