<div class="ball"></div>
body {
  background: #2F243A;
  display: flex;
  width: 99vw;
  height: 99vh;
  justify-content: center;
  align-items: center;
}

.ball {
  background: #DB8A74;
  width: 80px;
  height: 80px;
  border-radius: 50%;
}
View Compiled
gsap.to('.ball', {
  duration: 1.5,
  x: 200,
  scale: 2,
  ease: 'bounce'
})

gsap.to('.ball', {
  duration: 1.5,
  delay: 1.5,
  x: 0,
  scale: 1,
  ease: 'back.inOut(3)'
})
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.0.2/gsap.min.js