UI & components

Text animation ideas with prompts

Text animation turns a headline into the first thing people watch. Every effect here runs live in the page, so you can replay it, try it at phone width and copy the prompt that recreates it in CSS and a little JavaScript.

3 prompts

Prompts

Guide

How to prompt a text animation

  • Say what moves. Letters, words or whole lines change the result completely.
  • Give the timing. A stagger such as "90ms between words" keeps it readable.
  • Keep the real text readable. Ask for an aria-label so screen readers hear the sentence, not the pieces.