Back to Motion Prompt examples
Landing page & web effects, part 2 · #23
Scroll-down cue
A looping cue that invites you to scroll down. Below the hero, the word "SCROLL", a dot inside a mouse outline and arrows on either side keep repeating a downward motion.
Showcase effectsscroll-cuescroll-indicatorscroll-downheroarrowloop
Full motion specification
How the movement works
Use it when the hero fills the screen and people need a hint that the page goes on below.
- 01A 511 × 168 viewport. Centered below the hero: "SCROLL" (11 px, 3 px letter spacing) and a mouse outline (24 × 38, radius 12, line width 2.2). One beat takes 1.57 s (three per 4.7 s, six per 9.4 s pack cycle).
- 02The orange dot inside (5 × 9) drops 14 px over the first 70% of the beat (quadratic ease-in-out), fades out between 45% and 75%, and reappears at the top on the next beat.
- 0340 px to each side, two down-chevrons (line width 2.5) per side, half a beat apart, drift 24 px downward; their opacity follows a sine, 0 → 0.8 → 0.
Prompt
Add a scroll-down cue below the hero: a dot inside a mouse outline slides down and fades about every 1.5 s, on repeat.