Gradient Text Reveal animates any text in like it's being painted on. The text sits dim until a soft, blurred gradient blob travels across it, leaving each glyph lit in color before it resolves to a clean final state. It's a code component, so it stays sharp at any size and runs on real text, not an image.
What you can control:
Reveal mode — whole block at once, or line by line with adjustable stagger
Colors — four gradient stops plus a final resting color
Gradient — linear with angle, radial, or diamond, and how far it travels with the blob
Blob glow — strength, spread, and blend mode
Grain — amount, size, and blend for a touch of texture
Trigger — on appear, on scroll into view, or linked to scroll position
Replay — play once and rest, or replay each time it re-enters view
Tagging — Select correct accessibility tags
Drop it in as a hero heading, a section title, or a single word you want people to actually notice. Set your colors, pick a trigger, done.
Markus Friedl
