Motion · Gesture & Overlay
Swipe to Dismiss
Cards follow the finger and leave when flicked. The rest of the list closes the gap.
Maya commented
Looks great, ship it.
Build passed
main · 2m 14s
New sign-in
Chrome on Windows, Jakarta
Invoice paid
#1043 · $240.00
Specs#
| Dismiss | |offset| > 40% or |velocity| > 500px/s |
| Snap back | spring, bounce 0.2 |
| Opacity | fades with distance |
| Reflow | layout + popLayout |
| Built with | Motion |
Guidelines#
Use for
- Notifications, inbox items, suggestions
- Lists where dismissing is common
Avoid
- Swipe as the only way to dismiss — add a button
- Dismissing on a slow, short drag