A soft band of light that sweeps across text on a loop, ideal for loading labels, AI status messages and understated emphasis.
The live preview for this component is available in the free member library.
Text Shimmer paints a narrow highlight across a line of text using a clipped background gradient, so the effect is pure CSS paint with no layout work on each frame. The width of the highlight scales with the length of the text, keeping the sweep visually consistent between short and long labels. It is a natural fit for 'Generating…' and 'Thinking…' states in AI interfaces, skeleton-adjacent loading copy and subtle hero eyebrows. The text remains real, selectable text, colours are driven by two custom properties so it adapts to light and dark themes, and the sweep stops for visitors who prefer reduced motion.