30/12/2024

<div class="cir1">
  <div class="cir2">
    <div class="cir3"></div>
  </div>
</div>
<style>
  body {
    display: grid;
    place-content: center;
    height: 100%;
    width: 100%;
    margin: 0;
    background: #3F4869;
  }
  div {
    width: 8.1rem;
    height: 8.1rem;
    overflow: hidden;
  }
  .cir1{
    background: #EFCB5C;
    border-radius: 50%;
  }
  .cir2{
    translate: -4.3rem 0;
    background: #978963;
    clip-path: ellipse(48% 60% at 50% 50%);
  }
  .cir3{
    background: #3F4869;
    translate: -1.9rem 0;
    clip-path: ellipse(48% 50% at 50% 50%);
  }
</style>