body {
  background: #282c34;
}

@keyframes star {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-2000px);
  }
}

.particle {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: transparent;
  top: 0;
  left: 0;
  animation: star 100s linear infinite;
}

const numShadows = 700;

const generateParticle = (numShadows) => {
  let boxShadowValue = "";

  for (let i = 0; i < numShadows; i++) {
    boxShadowValue += `${Math.random() * 2000}px ${
      Math.random() * 2000
    }px #fff, `;
  }

  // 移除最後一個逗號和空格
  boxShadowValue = boxShadowValue.slice(0, -2);

  return boxShadowValue;
};

const particleElement = document.querySelector(".particle");
particleElement.style.boxShadow = generateParticle(numShadows);