Circular Progress

loaders

CSS

HTML

<svg class="circular-svg" viewBox="0 0 80 80">
  <circle class="track" cx="40" cy="40" r="35" />
  <circle class="fill" cx="40" cy="40" r="35" />
</svg>

Live Preview

Edit the CSS on the left to see live changes. The styles are scoped to the preview area.