JSFiddle - React, Tailwind, and code Playground
HTML
<div>
</div>
CSS
div {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: coral;
animation-name: out-and-in;
animation-duration: 3s;
animation-delay: .5s;
animation-iteration-count: infinite;
}
@keyframes out-and-in {
0% {
}
20% {
transform: translate(.5em, .5em);
}
40% {
transform: translate(0em, 0em);
}
100% {
}
}