+ 1
[SOLVED] how to create rainbow text in html alone
11 Answers
+ 4
<p style="background-image: repeating-linear-gradient(45deg, orange , yellow, green, cyan, blue, violet);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
">Rain</p>
https://code.sololearn.com/WpWbTMzENToT/?ref=app
+ 2
Something like this?
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<span style="color:#f00">R</span>
<span style="color:#f50">a</span>
<span style="color:#ff0">i</span>
<span style="color:#5f0">n</span>
</body>
</html>
+ 2
CalviŐ˛ I like what you did, I took it a little further đđđ
https://code.sololearn.com/WT9206k33a6L/?ref=app
+ 1
kinda but I want the color to change forever betwen all of the colors of the rainbow
+ 1
const rainbowColors = ["red", "yellow", "pink", "etc"];
const timeToChange = setInterval(change, 1000);
function changeColor(timeToChange) => {
for (let i = 0; i < rainbowColors.length; i++) {
document.getElementByClassName("rainbowLetter").style.color = rainbowColors[i];
}
}
// HTML each <span> would have a class or just use getElementByTagName('span') if those are the only spans, but usually they aren't.
// Something along those lines?
// edit: I'm using my phone right now, if that's what you're looking for I'll actually code it out when I'm at my laptop
+ 1
okay please code it
+ 1
you have to use css as style in html code
+ 1
Oh wow, sorry about that! I haven't been on here in a while...
This video will show you exactly how to accomplish what you need. https://youtu.be/rf7eOG0og3s
+ 1
thx