Text effects

Shimmer sweep text

A line of text where each letter brightens and dims in turn, sending a band of light travelling along the phrase on a loop.

Working

Using Shimmer sweep text

A line of text where each letter brightens and dims in turn, sending a band of light travelling along the phrase on a loop.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: text, duration, restDelay, highlight, wave

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

2136Cube flip lettersText effectsHovering a line turns every letter a quarter turn in 3D, one after another from a chosen origin, revealing a second face that carries the same glyph in the accent.

1962Flowing gradient headlineText effectsA headline whose letters are filled by a moving two-tone gradient, so a bright band drifts endlessly through the words, with an optional soft bloom behind.

1971Gradient sweep headingText effectsA large heading whose fill is a moving gradient band that sweeps continuously from one edge to the other, giving the text a glossy, ever-shifting sheen.

2177Keystroke TextText effectsText appears one character at a time as if being typed live, with a blinking cursor that keeps going after typing finishes.

1991Letter roll inText effectsA line of text where every character turns over on a horizontal axis, the old face rolling away as an identical face rolls in from below.

1930Shimmer Wave TextText effectsA brightness wave sweeps once across a line of text, lighting each character in turn before it dims back, then pauses briefly and repeats.