Glitch эффект для текста без искаженияна чистом CSS
HTML
<h1 class="glitch">t.me/VmCode</h1>
CSS
body {
background-color: #121b2b;
}
.glitch {
/* Выравниваем по центру */
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 60px;
color: #fff;
animation: glitch 0.5s linear infinite;
}
@keyframes glitch {
0%, 100% {
text-shadow: -2.5px -2.5px 0 #1f640a,
2.5px 2.5px 0 #f00;
}
25% {
text-shadow: 2.5px 2.5px 0 #1f640a,
-2.5px -2.5px 0 #f00;
}
50% {
text-shadow: 2.5px -2.5px 0 #1f640a,
-2.5px 2.5px 0 #f00;
}
75% {
text-shadow: 2.5px 2.5px 0 #1f640a,
2.5px -2.5px 0 #f00;
}
}