JSFiddle - React, Tailwind, and code Playground

HTML

<div style="text-align: center;">
  <svg version="1.1" id="logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 50 88" style="enable-background:new 0 0 50 88;" xml:space="preserve" height="150">
<path class="n" d="M13.3,67.4l3.1-10.2c1.2-4.1,8.6,3.9,10.5,10.4l6.6,17.5c1.5,4,7.5,3.9,8.7-0.3l5.4-18
	c4.6-15.2,2.2-31.5-3.3-46.4l0,0c-1.5-4-7.4-3.9-8.7,0.3l-3.1,19.1c-0.7,2.3-2.8,0.6-4.8-1.9c-2.3-3-3.8-6.4-4.7-10L17.2,2.9
	c-1.5-4-7.4-3.8-8.7,0.3L3.1,21.3C-1.5,36.5-1,52.7,4.6,67.6l0,0C6.1,71.7,12,71.5,13.3,67.4z"/>
</svg>

</div>

CSS

.n {
  animation-name: DrawLine;
  stroke-dashOffset: 300;
  stroke-dasharray: 300;
  fill: none;
}

svg { stroke: black; }