JSFiddle - React, Tailwind, and code Playground

HTML

<svg id="nekocat" data-name="nekocat" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 135.57 114.72">
  <title>neko</title>
  <g id="cat" data-name="新規シンボル cat">
    <path d="M654.3,549.78a43,43,0,0,0,2.2-13.69,39.19,39.19,0,0,0-4.16-17.76A35.47,35.47,0,0,0,637,521.5a85,85,0,0,0-15.23,9.86,96.57,96.57,0,0,0-22.81-2.61,108.37,108.37,0,0,0-25.18,2.85,87.4,87.4,0,0,0-15.4-10.06,35.27,35.27,0,0,0-15.48-3.22,39.18,39.18,0,0,0-4.15,17.76,44,44,0,0,0,2.2,13.85q-11.08,13-11.08,32.26,0,16.95,5.05,27a33.9,33.9,0,0,0,7,9.37,36,36,0,0,0,9.86,6.6,85.87,85.87,0,0,0,11.16,4.19,72.38,72.38,0,0,0,12.43,2.44q6.8,0.78,12,1T598.91,633q7.5,0,13.61-.37a119.67,119.67,0,0,0,14-1.79A69.71,69.71,0,0,0,640.34,627a44.12,44.12,0,0,0,11.49-7,32.86,32.86,0,0,0,8.6-10.84q5-10.1,5-27Q665.39,562.81,654.3,549.78ZM644.53,609a23.09,23.09,0,0,1-6.6,8.39,31.51,31.51,0,0,1-9.94,4.89,60,60,0,0,1-11.41,2.4,117.67,117.67,0,0,1-12.14.57H590.76a117.64,117.64,0,0,1-12.14-.57,60,60,0,0,1-11.41-2.4,31.49,31.49,0,0,1-9.94-4.89,23.08,23.08,0,0,1-6.6-8.39,28.19,28.19,0,0,1-2.61-12.51,25.33,25.33,0,0,1,5.62-16.62q5.62-6.84,15.24-6.84a156.63,156.63,0,0,1,15.89,1.71,91.75,91.75,0,0,0,25.58,0q12.55-1.71,15.89-1.71,9.61,0,15.23,6.84a25.33,25.33,0,0,1,5.62,16.62A28.21,28.21,0,0,1,644.53,609Z" transform="translate(-529.82 -518.33)"/>
    <path d="M577.44,583.67a7.68,7.68,0,0,0-11.81,0,16,16,0,0,0-3.5,6.19,22.42,22.42,0,0,0,0,13.36,16,16,0,0,0,3.5,6.19,7.68,7.68,0,0,0,11.81,0,16,16,0,0,0,3.5-6.19,22.42,22.42,0,0,0,0-13.36A16,16,0,0,0,577.44,583.67Z" transform="translate(-529.82 -518.33)"/>
    <path d="M629.58,583.67a7.68,7.68,0,0,0-11.81,0,16,16,0,0,0-3.5,6.19,22.4,22.4,0,0,0,0,13.36,16,16,0,0,0,3.5,6.19,7.68,7.68,0,0,0,11.81,0,16.08,16.08,0,0,0,3.5-6.19,22.44,22.44,0,0,0,0-13.36A16.1,16.1,0,0,0,629.58,583.67Z" transform="translate(-529.82 -518.33)"/>
  </g>
</svg>

CSS

body{
  background-color: #333;
}
#nekocat{
  margin: 100px;
  width: 300px;
  height: 300px;
  fill: transparent;
  stroke: white;
  stroke-width: .1;
  stroke-dasharray: 100 100;
  animation: test 3s ease-out 0s forwards;
}

@keyframes test {
  0% {
    stroke-dashoffset: 400; 
  }
  80% {
    stroke: rgba(255,255,255,0.8);
  }
  90%{
    stroke-dashoffset: 0;
    fill: rgba(255,255,255,0);
  }
  100% {
    stroke: rgba(255,255,255,0);
    fill: rgba(255,255,255,0.8);
  }
}