JSFiddle - React, Tailwind, and code Playground
CSS
@keyframes nuage {
from {left: -200px;}
to {left: 100%;}
}
html, body {overflow: hidden;margin: 0;background: #20262E;}
div {
position: absolute;
width: 200px;
height: 60px;
top: 50%;
left: -200px;
background: #fff;
border-radius: 50px;
animation: nuage 5s infinite linear;
}
div:before, div:after {
content: "";
position: absolute;
background: #fff;
border-radius: 100%;
}
div:before {
width: 100px;
height: 100px;
top: -55px;
right: 30px;
}
div:after {
width: 70px;
height: 70px;
top: -30px;
left: 30px;
}