🌈 Rainbow Letter

rainbow font11.mp4

Step 1: Tokenization

Since we're coloring each individual character, we gotta start by breaking down the text into single chars.

split(prop("text"),"")

Step 2: Color Bar

Pick a set of colors you vibe with. This'll be your color palette, making it a breeze to cycle through and color each character later on.

Next , let's use let() and map() to color the symbols and get a glimpse of the color band's style."

let(a,["red", "orange", "yellow", "green", "blue", "purple", "pink","gray"],map(split(repeat("▓",18),""),style(current,[a.at](<http://a.at/>)(index % 8))).join(""))

Step 3: Colorize

Take those characters you split earlier and combine 'em with the looping color logic from this step. Boom! You're coloring each letter.

lets(
a,["red", "orange", "yellow", 
"green", "blue", "purple", "pink","gray"],

b,split(prop("text"),""),

map(b,current.style(
			"b",a.at(index % 8),(a.at(index % 8)+"_background")
										)
		)
)

Step 4: Composition

Now, stitch those characters back together using join(). And just like that, you've got yourself some rainbow text!

lets(
colors, ["red", "orange", "yellow",
 "green", "blue", "purple", "pink","gray"],

a,prop("text").split(""),

a.map(
    let(
        text_color,

        colors.at(index % 8),
									
        current.style(text_color, "b","c", 
											text_color + "_background")
        )
    ).join(" ")
)