ive been trying to create a custom animated username style, this is an example of what I’m trying to make it look like:
however, this is what it ends up looking like:
what im focused on is trying to remove that bounce back it makes so that the animated gradient is constant in one direction only
this is the code I used:
a[href$=":FriskTheDetermined4534"],
a[href$="/FriskTheDetermined4534"] {
font-weight:bold;
background-size: 400%;
background-image: linear-gradient(to right,
#ff0000,
#ffa500,
#ffff00,
#00ff00,
#00ffff,
#0000ff,
#4b0082,
#ee82ee,
#ff0000,
#ffa500,
#ffff00,
#00ff00,
#00ffff,
#0000ff,
#4b0082,
#ee82ee,
#ff0000);
background-clip: text;
-webkit-text-fill-color: transparent;
animation: rainbow-username 7s linear infinite;
}
@keyframes rainbow-username {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
is there any way I can amend this code to get rid of the bounce back?
