JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<svg xmlns="http://www.w3.org/2000/svg" width="237.073" height="156.072" viewBox="0 0 237.073 156.072">
  <path class="path" id="Path_2" data-name="Path 2" d="M799.742,401.724s8.127,139.642-104.2,139.642c-115.574,0-102.2-139.642-102.2-139.642" transform="translate(-577.84 -400.294)" fill="none" stroke="#707070" stroke-width="30"/>
</svg>

CSS

body {
    margin: 0;
}

.path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: dash 3s infinite;
    /* transform: rotateX(180deg); */
}

@keyframes dash {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}