Skip to main content

Add scroll chaining (overscroll passthrough) for nested scrollable frames in prototypes

  • June 2, 2026
  • 0 replies
  • 5 views

Kyle_Johnson

Problem

When a vertically scrollable frame is nested inside another vertically scrollable frame, scrolling works inside the child until it reaches its top or bottom edge — at which point the scroll locks in place. The remaining scroll input is never passed to the parent frame, so the user has to physically move their cursor outside the child frame to continue scrolling the page.

Current behavior

Scroll input is captured entirely by whichever scroll container the cursor is over. When that container hits its limit, the input stops there and does not propagate.

Expected behavior

Match how browsers handle nested scroll containers by default: once a child scroll region reaches its edge, the leftover scroll should "chain" up to the parent, letting the user keep scrolling the page in one continuous gesture without repositioning the cursor.

Proposed solution

Add a scroll-chaining option to the Overflow settings on the Prototype tab — equivalent to CSS overscroll-behavior. Ideally with two modes:

  • Chain (default for web fidelity): overflow scroll passes to the parent at the child's edge.
  • Contain: current behavior preserved, for cases where an independent scroll panel (modal body, sidebar) should not pass scroll to the page.

Why it matters

This is one of the most common ways a Figma prototype diverges from real-world web behavior, and it makes any design with a nested scroll region (sticky sub-nav, in-page panels, scrollable cards) feel broken during user testing and client walkthroughs. It's been raised repeatedly with no resolution — for example: