Как сверстать пародию на тег progress в виде круга?
SVG, и нужно разобраться с атрибутами stroke-dasharray и stroke-dashoffset:
snippet
Блоки сгибаются через border-radius: 50%;
А анимацию делать примерно так (sass notation):
.loader
  animation: rotation 1s infinite linear;
  border: 3px solid rgba(70, 84, 14, 0.2);
  border-radius: 50%;
  border-top-color: rgba(70, 84, 14, 0.8);
  display: inline-block;
  height: 2em;
  width: 2em;
  margin: 0 1em;

@keyframes rotation
  to
    transform: rotate(360deg);