Just like on Apple.com, you can create multi-color gradient headings that stand out by combining the power of text spans and image text fills.
Just like the example here on Apple’s site, we can clip an image like this to real text (this is real, selectable text).
At any time, we can select text, and wrap it with a Span. And what that lets us do is create a style that only applies to the words I selected (...I’m just creating a class here...). And we’re going to do two things to make this happen.
First, we’ll set a background on our new Class. (We are just choosing an image background, and we can make sure it’s covering the selection...from the center.)
And second? All we have to do is clip the background to the text itself.
And that’s it. Spanned text with a clipped background, perfectly selectable — and since it’s actual text, it’s search engine-friendly.