CSS一個div實作一個心形

css

.heart {
      width: 100px;
      height: 100px;
      position: relative;
      background-color: #f00;
      transform: rotate(45deg);
    }
    .heart::before,
    .heart::after {
      position: absolute;
      content: '';
      background-color: #f00;
      top: 0px;
      left: -50%;
      width: 100%;
      height: 100%;
      border-radius: 50%;
    }

    .heart::after {
      left: 0;
      top: -50%;
    }
           

<div class="heart"></div>