Motion · Gesture & Overlay
Drawer
A sheet slides up from the bottom and can be flicked away. Velocity counts, not only distance.
Order #1043
Arriving tomorrow
Specs#
| Easing | --ease-drawer (0.32, 0.72, 0, 1) |
| Duration | 400ms open, 250ms close |
| Dismiss | offset > 30% or velocity > 500px/s |
| Overscroll | dragElastic 0.1 upward |
| Built with | Motion |
Guidelines#
Use for
- Mobile actions and forms
- Secondary flows that keep context
Avoid
- Requiring a long drag to dismiss
- A hard stop at the top edge — add friction instead