<div class="box gradient-green"></div>
<button>Restart</button>
body {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  flex-direction: column;
  gap: 1rem;
}

// fromTo approach
document.querySelector("button").addEventListener("click", () => gsap.fromTo(".box", {opacity: 0}, {opacity: 1}));


// Control method approach
// const anim = gsap.from(".box", {opacity: 0});
// document.querySelector("button").addEventListener("click", () => anim.restart());

External CSS

  1. https://codepen.io/GreenSock/pen/JGaKdQ.css

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/gsap.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/CSSRulePlugin.min.js
  3. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/CustomBounce3.min.js
  4. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/CustomEase3.min.js
  5. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/CustomWiggle3.min.js
  6. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/DrawSVGPlugin3.min.js
  7. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/Draggable.min.js
  8. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/EaselPlugin.min.js
  9. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/EasePack.min.js
  10. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/GSDevTools3.min.js
  11. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/InertiaPlugin.min.js
  12. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/MorphSVGPlugin3.min.js
  13. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/MotionPathHelper.min.js
  14. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/MotionPathPlugin.min.js
  15. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/Physics2DPlugin3.min.js
  16. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/PhysicsPropsPlugin3.min.js
  17. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/PixiPlugin.min.js
  18. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/ScrambleTextPlugin3.min.js
  19. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/ScrollToPlugin.min.js
  20. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/ScrollTrigger.min.js
  21. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/SplitText3.min.js
  22. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.4/TextPlugin.min.js