JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ball"></div>

CSS

.ball
{
    width: 10px;
    height: 10px;
    background-color: black;
    border-radius: 40px;
    position: absolute;
    
    animation: myfirst 20s linear 2s infinite;
    -webkit-animation: myfirst 20s linear 2s infinite;  /* Safari and Chrome */
}

@keyframes myfirst
{
    0%     {top: 150px; left:10px;}
    6.25%  {top: 100px; left:20px}
    12.5%  {top: 90px; left:30px;}
    //etc, every frame +6.25%
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
    0%  {top: 150px; left:10px;}
    6.25%  {top: 100px; left:20px}
    12.5%  {top: 80px; left:30px;}
    //etc, every frame +6.25%
}