JSFiddle - React, Tailwind, and code Playground
HTML
<div class="skills">
Front end Web development • 3d design • Graphic design • Community management • Open source • Technical support • Technical Writing • Figma • Pricacy & cybersecurity • Search Engine Optimization • Logo design
</div>
<div class="langs">
HTML5 • CSS3 • JavaScript • Markdown • npm • Inkscape • Gimp • Figma • Git & GitHub & GitLab • SVG • PHP • Python • Wordpress • Mailchimp
</div>
CSS
.skills, .langs {
text-transform:uppercase;
font-family:'Anton', sans-serif;
font-size:4vw;
display: inline-block;
white-space: nowrap;
animation: floatText 25s infinite linear;
padding-left: 100%; /*Initial offset*/
color:#ada97d;
}
.langs {
animation-delay:5s;
}
.skills:hover, .langs:hover {
animation-play-state: paused;
}
@keyframes floatText {
to {
transform: translateX(-100%);
}
}