Timer CSS animation

timer.css

svg {
  display: inline-block;
  height: 90px;
  width: 90px;
}
svg.timer {
  transform: rotate(-90deg);
  overflow: visible;
}
circle.gague {
  animation: delay-progress 5000ms both linear;  
}

@keyframes delay-progress {
  from {
    stroke-dashoffset: 0;
  }
  to {
    stroke-dashoffset: 1;
  }
}

timer.html

<div class="container">
  <svg class="timer">
    <circle
        class="gague"
        cx="45"
        cy="45"
        r="45"
        stroke-dasharray="1"
        pathLength="1"
        stroke="green"
        stroke-width="20"
        fill="transparent"
    />
  </svg>
</div>