Text effects

Shimmer Wave Text

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

Using Shimmer Wave Text

Shimmer Wave Text uses the inline preview frame with a light/dark theme setting.

Customize the preview

These controls are passed to the demo. Defaults and limits describe the preview; consult the implementation for its full prop API.

Control	Type	Default	Preview limits
`duration`	`number`	`1`	From 0.4 to 3; step 0.1
`label`	`text`	`Loading results`	Up to 40 characters
`paused`	`boolean`	`false`	No additional limit in the metadata.
`accentColor`	`color`	`#F5F6F8`	No additional limit in the metadata.

Which frameworks are available for Shimmer Wave Text?

Shimmer Wave Text is available for React, Vue, Svelte, Astro, HTML. The live preview uses React; the source observations below apply to index.tsx. Check the selected port before relying on the same interactions.

What does Shimmer Wave Text depend on?

The React metadata lists these npm dependencies beyond React: clsx, tailwind-merge.

What accessibility details are visible in Shimmer Wave Text?

The React source for Shimmer Wave Text includes: attributes and handlers (aria-hidden, aria-label). These are source observations. Verify accessible names, focus order and keyboard behavior in the composed page.

How does Shimmer Wave Text handle reduced motion?

The source scan found no direct useReducedMotion() or matchMedia preference read in Shimmer Wave Text's index.tsx. Check the full implementation, shared styles and selected port with reduced motion enabled; these observations do not establish that every animation stops.

Connect your agent

Related open components

Still of the Shimmer sweep text component, a Fieldbook UI component in Text effects.

2036Shimmer sweep textText effectsA line of text where each letter brightens and dims in turn, sending a band of light travelling along the phrase on a loop.

Still of the Sweeping status text component, a Fieldbook UI component in Text effects.

2060Sweeping status textText effectsA large status word that swaps on a steady beat while a bright band sweeps endlessly across the letterforms.

Still of the Wavy letter heading component, a Fieldbook UI component in Text effects.

2464Wavy letter headingText effectsA heading whose letters ride a slow wave, each one lagging the last so the line ripples like a flag without losing its baseline.

Still of the Cascading Letter Reveal component, a Fieldbook UI component in Text effects.

2824Cascading Letter RevealText effectsA headline that reveals itself letter by letter with a soft rise and fade as it enters view, then holds steady once finished.

Still of the Circular hover speed ring component, a Fieldbook UI component in Text effects.

2320Circular hover speed ringText effectsA phrase spins slowly around a circle until the pointer arrives, then snaps to a fast spin and grows slightly before easing back once the pointer leaves.

Still of the Color Band Text Reveal component, a Fieldbook UI component in Text effects.

2124Color Band Text RevealText effectsA soft band of several colors glides once across a line of text with an ease-in ease-out motion, tinting each letter as it passes before the text settles into a solid color.