Perfect 💥 — you’ve added the official GSAP docs link (https://gsap.com/). Let’s now expand it with detailed GSAP documentation info, including official sections, usage guides, and hidden gems many developers miss.

Here’s the comprehensive GSAP documentation breakdown 👇

GSAP’s core module handles all the basic animations. Once you import or include it, you can use these main methods:

📄 Docs Link: 👉 GSAP Core Methods

Timelines give you precise control to chain and organize multiple animations.

const tl = gsap.timeline({ repeat: 2, yoyo: true });

tl.to(".box", { x: 100, duration: 1 })
  .to(".circle", { y: 100, duration: 1 })
  .to(".triangle", { rotation: 360, duration: 1 });

📄 Docs Link: 👉 GSAP Timeline Docs

GSAP includes official plugins that extend functionality — these are the real power tools 🔧

GSAP comes with super-useful utility helpers via gsap.utils.

📄 Docs Link: 👉 GSAP Utilities

Eases define how your animation moves.

📄 Docs Link: 👉 Easing Docs

You can run code at specific points during an animation:

Example:

gsap.to(".box", {
  x: 200,
  duration: 2,
  onStart: () => console.log("Started"),
  onComplete: () => console.log("Completed")
});

📄 Docs Link: 👉 Callbacks Docs

When using GSAP in React, wrap animations in gsap.context() for cleanup and scope safety:

import { useEffect, useRef } from "react";
import { gsap } from "gsap";

export default function Example() {
  const boxRef = useRef();

  useEffect(() => {
    const ctx = gsap.context(() => {
      gsap.to(boxRef.current, { x: 300, duration: 2 });
    });
    return () => ctx.revert(); // cleanup on unmount
  }, []);

  return <div ref={boxRef} className="box"></div>;
}

📄 Docs Link: 👉 React Integration Docs

The GSAP team provides live interactive examples on CodePen:

👉 GSAP CodePen Collection Learn via hands-on demos (ScrollTrigger, MotionPath, Flip, etc.)

GSAP has premium (paid) plugins via Club GreenSock:

• MorphSVGPlugin 🌀 — morph SVG paths
• DrawSVGPlugin ✏️ — draw SVG strokes
• SplitText 💬 — animate individual letters
• GSDevTools ⚙️ — debug timelines visually

📄 Docs Link: 👉 Club GreenSock