What is a scrolling text marquee?
A scrolling text marquee is a band of text that slides continuously from one side of the screen to the other. It's used as a bold visual separator, for slogans, for lists of services or clients, or for announcements you don't want to miss.
The old HTML <marquee> tag is obsolete and choppy. The modern way is a CSS animation over duplicated text, which is exactly what this effect does for you.
How to add scrolling text in Elementor
- Add a native Heading or Text Editor widget.
- Write your text and style it — typography, size, color, uppercase, anything you like.
- Open the Advanced tab and find Pro Effects – Texts.
- Select Text Loop.
- Set the direction, speed, gap and whether it pauses on hover.
- Preview the published page to see the loop running.
You keep full control of the typography with Elementor's own style controls; the effect only handles the motion.
Settings you can adjust
| Setting | What it does | Default |
|---|---|---|
| Direction | Left or right | Left |
| Speed | Time for one full loop, in milliseconds (lower = faster) | 10,000 ms |
| Gap | Space between repetitions of the text | 40 px |
| Pause on hover | Stops the loop while the cursor is over it | Off |
| Edge Fade | Soft fade at both edges | 0 px (off) |
| Disable on mobile | Shows static text on phones | Off |
Ideas that work
- Giant uppercase slogan between two sections, 120 px or bigger.
- Services list separated by a symbol:
Branding ✦ Web design ✦ Motion ✦. - Two lines in opposite directions, one above the other, for a dynamic band.
- Announcement bar at the top of a landing page.
For images or client logos instead of text, use Logo Marquee.
Why it's light
The movement is a pure CSS animation, so the browser runs it on the compositor without JavaScript on every frame. The effect's script only duplicates the text once to fill the container — about 6 KB before minification, with no animation library.
Related effects
- Logo Marquee — an infinite marquee for logos and images.
- Blur Text Reveal — text that goes from blurred to sharp on scroll.
- Glitch Text — RGB glitch on hover.
