JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.2.6/gsap.min.js"></script>
<button onclick="playShowMsg()">Жмай</button>
<div class="msg">Сообщение успешно отправлено</div>

CSS

.msg {
  font-family: Helvetica;
width: 320px;
    position: absolute;
    padding: 25px 15px;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0;
    color: #ffffff;
    text-align: center;
    border-radius: 7px;
    background: #38E144;
    font-weight: 500;
    opacity: 0;
    visibility: hidden;
}

JavaScript

var showmsg = new TimelineMax();
showmsg.add(gsap.to(".msg", 0.7, {autoAlpha: 1, y: -40,ease: Expo.easeOut}));
showmsg.add(gsap.to(".msg", 0.7, {autoAlpha: 0, y: 0,ease: Expo.easeOut,delay: 2}));
showmsg.pause();

function playShowMsg() {
showmsg.restart();
}