JSFiddle - React, Tailwind, and code Playground
by luka kupunia
HTML
<div>
<span>
something
</span>
</div>
CSS
div {
font-size: 69px;
height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background:#323232;
}
div span{
font-weight: bold;
text-transform: uppercase;
color:transparent;
-webkit-background-clip:text;
background-image: url(http://picsum.photos/1200/900);
animation-name: s;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
animation-fill-mode:forwards;
}
@keyframes s{
0{
background-position: left;
}
50%{
background-position: right;
}
}