css svg creepy crawley

by Felis Catus

HTML

<svg width="200" height="100" version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 60">
  <path class="funpath" d="m 90.357143,35.93361 c -0.47619,-0.119048 -0.947257,-0.26088 -1.428571,-0.357143 -0.233472,-0.04669 -0.476191,0 -0.714286,0 -0.714286,0 -1.428572,0 -2.142857,0 -2.142857,0 -4.285715,0 -6.428572,0 -0.833333,0 -1.666666,0 -2.5,0 -0.160842,0 -0.962738,-0.05435 -1.071428,0 -0.150585,0.07529 -0.206559,0.28185 -0.357143,0.357143 -0.285714,0.142857 -0.785714,-0.142858 -1.071429,0 -0.106479,0.05324 0.08418,0.272963 0,0.357142 -0.125364,0.125365 -1.539024,-0.123345 -1.785714,0 -0.150585,0.07529 -0.206558,0.281851 -0.357143,0.357143 -0.22531,0.112656 -1.560404,-0.112655 -1.785714,0 -0.882645,0.441323 0.123278,0.357143 -0.714286,0.357143 -0.160842,0 -0.962738,-0.05434 -1.071428,0 -0.150585,0.07529 -0.206559,0.281851 -0.357143,0.357143 -0.10648,0.05324 -0.244205,-0.03765 -0.357143,0 -0.252538,0.08418 -0.461748,0.272963 -0.714286,0.357143 -0.112938,0.03765 -0.250663,-0.05324 -0.357143,0 -0.150584,0.07529 -0.206558,0.28185 -0.357143,0.357143 -0.106479,0.05324 -0.272963,-0.08418 -0.357142,0 -0.08418,0.08418 0.08418,0.272963 0,0.357143 -0.178572,0.178571 -0.892858,-0.178572 -1.071429,0 -0.08418,0.08418 0.08418,0.272963 0,0.357142 -0.188231,0.188231 -0.492795,0.209483 -0.714286,0.357143 -0.140083,0.09339 -0.206558,0.281851 -0.357143,0.357143 -0.106479,0.05324 -0.250663,-0.05324 -0.357142,0 -0.150585,0.07529 -0.206559,0.281851 -0.357143,0.357143 -0.10648,0.05324 -0.272964,-0.08418 -0.357143,0 -0.08418,0.08418 0.08418,0.272963 0,0.357143 -0.08418,0.08418 -0.250664,-0.05324 -0.357143,0 -0.150585,0.07529 -0.281851,0.206558 -0.357143,0.357143 -0.04695,0.09391 0,1.241814 0,1.428571 0,0.119048 0.08418,0.272964 0,0.357143 -0.08418,0.08418 -0.272963,-0.08418 -0.357143,0 -0.08418,0.08418 0,0.238095 0,0.357143 0,0.714286 0,1.428571 0,2.142857 0,0.119048 -0.05324,0.250663 0,0.357143 0.158275,0.316549 0.854687,0.746316 1.071429,1.071428 0.217497,0.326246...

SCSS

.funpath {
  fill: none;
  stroke: #004d74;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-dasharray: 0.5 20 0.5 20 0.5 150;
  transition: stroke-dashoffset 10s linear;
  &.smalldash {
    stroke-width: 1;
    stroke-dasharray: 3 3;
    stroke-dashoffset: 0 !important;
    pointer-events: none;
  }
  svg:hover & {
    stroke-dashoffset: -1000;
  }
}