Next-generation scroll animations

Fluid scroll transitions. Crafted for React.

Copy and paste high-performance scroll sequences into your apps. Built on a persistent-layer architecture that guarantees layout stability, accessibility, and buttery-smooth motion.

Get started Browse components
Works with your stack
npx sectionflow-cli init

No heavy runtimes or layout thrashing. Pure motion values mapped perfectly to your scroll position.

72+
Transitions
8
Categories
11
Coming Soon
TypeScript + Framer Motion
Primary Engine

Start with the best

Wave Reveal

An SVG wave cap rides the incoming section as it sweeps upward.

Circular Portal

The next section blooms out of a circular portal in the center.

Spotlight Reveal

A soft spotlight mask grows until the next section fills the frame.

Ink Spread

Two organic ink blots spread and merge to reveal the next section.

Explore by pattern

WaveBrowseSVGBrowsePerspectiveBrowseScrollBrowseGridBrowseMorphBrowseParallaxBrowseOtherBrowse
Architecture

Engineered for speed and readability.

We built SectionFlow to solve the hardest parts of scroll animations. Every transition reserves a safe viewing phase, guaranteeing your content is always readable. Animations run on the compositor, ensuring React only re-renders when absolutely necessary.

Own your code

This is not an npm package. Grab the code, customize the easing curves, and integrate it seamlessly into your own design system.