Also called Ticker, Infinite Scroll Text
A row of content slides sideways in an endless, seamless loop.
Use for
Logo walls, announcements, keyword bands and news tickers
Add a "Marquee" (an infinite horizontal scroll, also called a ticker) to [where].
The content should slide from right to left at a slow, steady speed in a seamless loop with no visible jump.
Pause it on hover, and stop the motion when the user prefers reduced motion (prefers-reduced-motion).
Also called Repeated Text Scroll
A word is duplicated into many stacked copies that shift with scroll.
Add a "Text Repetition" effect (also called repeated text scroll) to [where].
A word should be copied into a stack of fainter outline copies that spread out from behind it as the user scrolls, and fold back together when scrolling up.
Tie the spread directly to the scroll position, and hide the extra copies from screen readers so the word is read only once.
Also called On-Scroll Sliced Text
A heading is cut into horizontal slices that shift sideways against each other as the page scrolls.
Add a "Sliced Text" effect (also called on-scroll sliced text) to [where].
A large heading should be cut into horizontal slices that slide sideways against each other as the user scrolls, lined up into the whole word at the start.
Tie the shift directly to the scroll position so scrolling back reverses it, and keep the heading as one readable text for screen readers.