style.css

:root{
    --loaderStart: 0deg;
    --loaderEnd: 180deg;
}

body {
  background-color: rgb(25,25,25);
}

@property --loaderStart {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
  }
  
  @property --loaderEnd {
    syntax: '<angle>';
    inherits: false;
    initial-value: 180deg;
  }

.loader{
  filter: drop-shadow(black 0px 10px 10px);
  position:relative;
  top: calc(50vh - 62.5px);
  left: calc(50vw - 125px);
  width: 250px;
  height: 250px;
  border-radius: 99999px;
  background: conic-gradient(from -90deg, rgba(0,0,0,0) var(--loaderStart), #81FBB8 var(--loaderStart), #28C76F var(--loaderEnd), rgba(0,0,0,0) var(--loaderEnd));
  animation: gradient 3s infinite ease;
}

@keyframes gradient{
    0% {
		--loaderStart: 0deg;
		--loaderEnd: 0deg;
	}
	33% {
		--loaderStart: 0deg;
		--loaderEnd: 180deg;
	}

    66% {
		--loaderStart: 180deg;
		--loaderEnd: 180deg;
	}
    100% {
		--loaderStart: 0deg;
		--loaderEnd: 0deg;
	}
}