JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box"></div>

CSS

.box {
    position: relative;
    width: 400px;
    height: 400px;
    background: repeating-conic-gradient(
      from var(--aa),
      #ff9e80 0%,
      #ff9e80 5%,
      transparent 5%,
      transparent 40%,
      #ff9e80 50%
    );
    
    animation: animate 6s linear infinite;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
    border-radius: 20px;
}

@property --aa {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@keyframes animate {
    0% {
        --aa: 0deg;
    }
    100% {
        --aa: 360deg;
    }
}

.box::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: repeating-conic-gradient(
      from var(--aa),
      #80d0ff 0%,
      #80d0ff 5%,
      transparent 5%,
      transparent 40%,
      #80d0ff 50%
    );
    animation: animate 4s linear infinite;
    animation-delay: -2s;
    border-radius: 20px;
}

.box::after {
    position: absolute;
    content: "";
    inset: 8px;
    background: #2d2d39;
    border-radius:!5px;
    border: 8px solid #25252b;
    filter: blur(1px);
}