JSFiddle - React, Tailwind, and code Playground

HTML

<div class="tile" id="tile1"></div>

CSS

.tile {
    position:absolute;
    z-index:10;
    background-color:#e20074;
    width:5px;
    height:5px;
}
#tile1 {
   
    /* older Firefox: */
   
    /* Safari and Chrome: */
    -webkit-animation:tile1 6s linear infinite;
    /* Opera: */
    -o-animation:tile1 6s linear infinite;
}
@-moz-keyframes tile1 {
    0% {
        left:10px;
        top: 0;
        visibility:visible;
    }
    10% {
        left:20px;
        top:10px;
    }
    20% {
        left:30px;
        top:15px;
    }
    30% {
        left:40px;
        top:10px;
    }
    40% {
        left:50px;
        top:0px;
    }
    50% {
        left:60px;
        top:10px;
    }
    60% {
        left:70px;
        top:15px;
    }
    70% {
        left:80px;
        top:10px;
    }
    80% {
        left:90px;
        top:0px;
    }
    90% {
        left:100px;
        top:10px;
    }
    100% {
        left:115px;
        top:15px;
    }
}
@-webkit-keyframes tile1 {
    0% {
        left:10px;
        top: 0;
        visibility:visible;
    }
    10% {
        left:20px;
        top:10px;
    }
    20% {
        left:30px;
        top:15px;
    }
    30% {
        left:40px;
        top:10px;
    }
    40% {
        left:50px;
        top:0px;
    }
    50% {
        left:60px;
        top:10px;
    }
    60% {
        left:70px;
        top:15px;
    }
    70% {
        left:80px;
        top:10px;
    }
    80% {
        left:90px;
        top:0px;
    }
    90% {
        left:100px;
        top:10px;
    }
    100% {
        left:115px;
        top:15px;
    }
}