JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>

CSS

div{
  width: 100px;
  height: 100px;
  opacity:0;
  background: green;
 animation:bro 5s linear, bro1 5s 6s linear ;
 animation-fill-mode:forwards;
  
  }

@keyframes bro{
  from {
    opacity:0;
  }  

  
  to{  
    opacity:1;
  }
}


@keyframes bro1{
  from{
    opacity:1;
  }
  to{
    opacity:0;
  }
}