<div class="loader"></div>

.loader {
  height: 47px;
  aspect-ratio: 5;
  --c: #000 90deg,#0000 0;
  background:
   conic-gradient(from 135deg at top   ,var(--c)),
   conic-gradient(from -45deg at bottom,var(--c)) 12.5% 100%;
  background-size: 20% 50%;
  background-repeat: repeat-x;
  animation: l1 2s infinite steps(6);
  clip-path: inset(0 100% 0 0);
}
@keyframes l1{
  to {clip-path: inset(0 0 0 0)}
}



body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-content: center;
  gap: 20px;
}