Easing

You can control how fast at which point animation is runing by setting ease property. Default value is easeOut

For every ease you can specify: in, inOut or default is out values, to control how starts/ends. For example setting bounce.out it bounces at the end, but setting bounce.in instead makes tween bounce at start and move to the end

You can check all ease types and visualise them using gsap ease visualiser

linear

Linear or powe0 always go same speed. There is no point to set in or inOut here because its linear anyway

...
ease: 'linear',
ease: 'linear.in',
ease: 'linear.inOut',
ease: 'power0',
...
      

bounce

Bounce forces animation to bounce from edge couple times, decreasing bounciness with every bounce

  ...
  ease: 'bounce',
  ease: 'bounce.in',
  ease: 'bounce.inOut',
  ...
        

elastic

Elastic similar to bounce, but it go past animation end and returns back.

...
ease: 'elastic',
ease: 'elastic.in',
ease: 'elastic.inOut',
...
              

back

Back goes past animation end edge, and then backs. We can use it as a function by passing number, which tells how far away we should move.

...
ease: 'back',
ease: 'back.in',
ease: 'back.inOut',
ease: 'back(5)',
ease: 'back.in(5)',
ease: 'back.inOut(5)',
...