v149 · Interactions · Overscroll

Swipe Drawer

An action drawer that reveals from the bottom when the user overscrolls a feed past its last item. The same gesture native apps use for share sheets and context menus — triggered purely by scroll momentum, no touch-event bookkeeping required.

Origin Trial / Developer Preview: Overscroll Gestures are behind a flag in Chrome 149. Enable chrome://flags/#overscroll-gestures to see native CSS-driven behaviour. This demo simulates the pattern with JavaScript so you can understand the intent regardless of flag status.
Scroll the feed to the end — overscroll past the last item to open the drawer
chrome 149 · overscroll drawer demo
↑ scroll up to close · swipe down for more
Quick Actions
Share
Save
Filter
Settings

event log

— waiting for scroll events —

how it works

/* The container prevents overscroll propagation */
.scroll-host {
  overflow-y: auto;
  overscroll-behavior-y: contain;
}

/* The drawer anchors to the overscroll region below the list */
/* (CSS Overscroll Gestures API — Chrome 149 flag/OT) */
.bottom-drawer {
  overscroll-attach: bottom;      /* attach to bottom overscroll region */
  overscroll-threshold: 60px;    /* how far past end to trigger */
}

/* On overscroll-commit the drawer transitions open */
.bottom-drawer:overscrolled {
  transform: translateY(0);
}

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗