Do the effects run on mobile too?

Yes. The effects are tuned for touch and small screens and stay calm and smooth there.

Are scroll animations disabled with reduced motion?

Yes. When the reduced motion setting is active, the effects are eased back.

Elements/Scroll Effects

These effects are tied directly to the scroll position. Scroll slowly to feel the motion.

Tap a card to play the effect.

Progress & indicators

Reading progress and scroll indicators.

Scroll Measure LineNew

Scroll Reading FocusNew

Reading Progress Line

Scroll Progress Dots

Scroll Progress Bar

Image & card

Cards, images and galleries with scroll motion.

Scroll Expand Banner

Scroll Perspective Card

Scroll Clip Reveal

Scroll Layer Slide

Scroll Reveal Grid

Scroll Scale Card

6 of 10 shown

Layout scroll

Snap, pinning and section-by-section motion.

Scroll Parallax Columns

Fade In Up Section

Scroll Section Fade

Scroll Sideways Scroll

Sticky Stacking Cards

Horizontal Scroll Pin

Accents & lines

Lines, marquees, quotes and background changes.

Scroll Color Background

Scroll Velocity Text

Scroll Line Draw

Scroll Rotate Badge

Scroll Fade Stack

Scroll Marquee Strip

6 of 8 shown

Text masks

Large typography revealed on scroll via a mask gradient.

Diagonal Text Reveal

FAQ

Frequently asked questions

They use Framer Motion's scroll utilities and tie animations to the scroll position without hurting performance.

Didn't find your question? We're happy to help.

Get in touch