That circular progress ring you see in every dashboard? It's one <circle> and two CSS properties. No library. Here's a live, animated rebuild with a slider, a count-up number, and an indeterminate spinner.

⭕ Try it (drag the slider): https://dev48v.infy.uk/design/day14-progress-ring.html

The whole trick: dasharray + dashoffset

An SVG circle's outline can be turned into a dash pattern. Set stroke-dasharray to the full circumference, and stroke-dashoffset controls how much of it is hidden. Offset = circumference → fully hidden (0%); offset = 0 → fully drawn (100%).

The math