11/08/2023

<div class="battle-wrapper">
  <div class="circle"></div>
</div>
<style>
  :root {
    --gradient: linear-gradient(to right, #62306d 50%, #f7ec7d 50%);
  }
  .battle-wrapper {
    margin: 0;
    background: var(--gradient);
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 400px;
    height: 300px;
  }
  .circle {
    width: 200px;
    height: 200px;
    background: var(--gradient);
    transform: rotate(180deg);
    border-radius: 50%;
  }
</style>