Css circle with 2 borders

I want to make this loader using CSS:
I found this loader on loading.io, but how to do it using CSS?

The png doesn’t have transparency so it would only work on a white background. Also, I’m confused, you say you found it on loading.io but it looks like it’s from the fCC CDN.

<img src="https://global.discourse-cdn.com/freecodecamp/original/3X/3/9/398562988d276402dee56af3b365208bc5a5f9a6.png" alt="">
img {
  animation: rotate 2s infinite linear;

@keyframes rotate {
  from {
    transform: rotate(0deg);
  to {
   transform: rotate(359deg);

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.