JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>

CSS

div {
    background: skyblue;
    height: 100px;
    width: 100px;
    -webkit-animation: test 2s ease forwards;
    animation: test 2s ease forwards;
    opacity: 0;

}

@-webkit-keyframes test {
    0% {
         opacity: 0;   
    }
    
    100% {
     opacity: 1;   
    }
    
}

@keyframes test {
    0% {
         opacity: 0;   
    }
    
    100% {
     opacity: 1;   
    }
    
}