JSFiddle - React, Tailwind, and code Playground

by Sasha Morozov

HTML

<div>SASHA MOROZOV</div>

SCSS

div {
    font: bold 60px/1 sans-serif;
    margin: 20px;
    position: relative;
    display: inline-block;
        &:after, &:before {
            content: 'SASHA MOROZOV';
            display: inline-block;
            position: absolute;
            z-index: -1;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
        }
        &:before {
            color: #00FED9;
            animation: cyan 6s ease-out forwards;
        }
        &:after {
            color: #FC016A;
            animation: magenta 6s ease-out forwards;
        }
}
@keyframes cyan {
    from {
       transform: translate(-2px, 2px);
    }
    to {
        transform: translate(0, 0);
    }
}
@keyframes magenta {
    from {
       transform: translate(2px, -2px);
    }
    to {
        transform: translate(0, 0);
    }
}