<div class="flex gap-4 p-4">
  <div class="my-box w-24 h-24 bg-red-500"></div>
  <div class="my-box w-24 h-24 bg-sky-500"></div>
  <div class="my-box w-24 h-24 bg-lime-500"></div>
</div>
<div id="info" class="p-4">
  
</div>

gsap.from(".my-box", {
  opacity: 0,
  duration: 2,
  delay: 1,
  stagger: 0.5,
  onStart: () => {
    document.querySelector("#info").innerText = "Start";
  },
  onComplete: () => {
    document.querySelector("#info").innerText = "Ende";
  }
});