sparks.svg

<svg id="sparks" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
  <polygon class="spark red" points="136.85 157.73 136.85 157.73 96.522 151.09 59.072 163.69 105.17 181.36 135.38 184.34 160.61 168.45"/>
  <polygon class="spark black" points="86.074 218.17 70.912 200.72 49.639 191.21 62.588 208.75"/>
  <polygon class="spark" points="18.449 169.62 57.799 159.04 19.714 148.6 7.1054e-15 148.6 0 148.6 0 163.03"/>
  <polygon class="spark" points="0 123.05 8.044 121.58 0 118.11"/>
  <polygon class="spark" points="165.37 121.22 165.37 121.22 130.45 106.14 98.068 109.56 64.517 134.71 103.91 128.06 138.98 133.7"/>
  <polygon class="spark red" points="69.62 125.52 29.163 125.52 3.4811 131 41.157 140"/>
  <polygon class="spark red" points="161.4 227.98 150.69 216.86 136.35 211.15 119.12 213.77 119.12 213.77 140.04 231.23 168.4 247.4 169.99 247.4"/>
  <polygon class="spark" points="32.03 104.78 47.442 105.7 56.74 97.128 0 97.128 0 97.128 0 97.482"/>
  <polygon class="spark red" points="165.77 67.25 104.1 72.763 56.74 101.21 94.52 93.09 94.52 93.09 134.04 88.761"/>
  <polygon class="spark" points="161.02 44.912 171.91 31.666 171.91 24.128 161.02 25.583 161.02 25.583 137.99 38.037 114.48 55.648 142.62 51.303"/>
  <polygon class="spark black" points="29.066 79.082 63.704 63.434 74.317 54.247 84.029 37.189 84.029 37.189 59.187 51.202"/>
  <polygon class="spark black" points="151.67 136.33 171.91 141.16 171.91 132.01"/>
  <path id="motionPath" style="stroke:#000;stroke-width:1px;fill:none" d="m 16.162,95.39 c 121.73,-30.31 118.19,46.97 118.19,46.97 0,0 1.5152,149.5 57.579,-16.162 56.063,-165.67 13.132,105.56 60.104,0 46.972,-105.56 57.074,-18.688 81.822,-30.305 24.749,-11.617 10.102,-31.82 36.365,-22.223"/>
</svg>