GSAP Tween

Los tres métodos principales de GSAP. from, to y fromTo son la base de todas las animaciones.

Código

const boxRef = useRef(null)

// from → anima DESDE estos valores hasta el estado actual
gsap.from(boxRef.current, {
  opacity: 0,
  x: -100,
  duration: 0.8,
  ease: "power2.out"
})

// to → anima HACIA estos valores desde el estado actual  
gsap.to(boxRef.current, {
  rotation: 360,
  scale: 1.2,
  duration: 0.6,
  ease: "back.out(1.7)"
})

// fromTo → control total de inicio y fin
gsap.fromTo(boxRef.current,
  { opacity: 0, y: 40 },
  { opacity: 1, y: 0, duration: 0.8 }
)