JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.0/TweenMax.min.js"></script>
<div></div>

CSS

div{
  position: absolute;
  left: 50%;
  top: 0;
  width: 100px;
  height: 100px;
  background: red;
  transform: translate(-50%, 0);
}

JavaScript

let customShit = Elastic.easeOut.config(1, 0.35);

TweenMax.fromTo('div', 1, {
    y: 0 + '%',
}, {
    y: 100 + '%', 
    opacity: 1, 
    ease: customShit
});