AI Text Loading

AI Text Loading
AI Text Loading

About AI Text Loading

A single line of text that cycles through your phrases. Each phrase slides up and fades out as the next one comes in, a gradient sweeps across the letters, and a dot pulses beside them.

What you can change

  • The list of phrases, and the time between them, from 500 ms to 5 seconds.

  • The three gradient colors and how long one sweep takes, from 0.5 to 8 seconds.

  • The dot: on or off, its color, and its size from 4 to 20 px.

  • The font and the background color.

Where it fits

Chat interfaces, AI search and generation tools, and loading screens that name what is happening.

Good to know

  • It shows the phrases you enter and loops forever. It isn't tied to a real process and has no finished state.

  • Phrases stay on one line, and the frame clips anything too long. Set the frame's width to your longest phrase.

  • Shimmer Speed is a duration, so a higher number is slower.

  • The swap between phrases takes about 0.6 seconds, so a very short interval leaves little time to read.

  • The editor shows a still of the first phrase. It plays in preview and on the published site.

  • Visitors who ask for reduced motion see the phrases fade with no slide, sweep or pulse.

From Syauqizaidan Khairan Khalaf

AI Loading State
Animated Terminal
OS Download Button
CSV DataTable

Related Components

Animation loader
Bloop Preloader
Box Page Reveal
Dot Spinner Matrix