interaction design
Pull to refresh
What is pull to refresh?
Pull to refresh is the gesture - drag the top of a list downward and release - that reloads its content. It became a near-universal mobile convention because it's discoverable through experimentation, reuses a natural scrolling motion, and gives the user a direct, physical way to ask for the latest, with satisfying feedback as the content updates.
Also known as: pull to refresh, pull-to-refresh, swipe to refresh
Prefer to watch?
Watch the recap 1:04
The demo
A little feed. Pull it down - drag from the top - and release past the line to refresh. Feel the gesture respond as you pull. (There's a Refresh button too, for anyone who'd rather just tap.)
What this demo shows (text version)
A small phone-style feed can be refreshed by pulling it down from the top: as you drag, an arrow and spinner respond to how far you've pulled, and releasing past a threshold triggers a refresh that loads new items with satisfying feedback. Alongside the gesture, a visible "Refresh" button does the same thing - the accessible, non-gesture fallback.
That's pull to refresh: a learned convention that maps a physical gesture to "get me the newest", discoverable because it reuses scrolling and well-placed at the top of the feed. Its weakness is that the gesture is invisible to anyone who doesn't know it or can't perform it, so it should be a familiar shortcut layered on an accessible baseline - never the only way to refresh.
Pull to refresh works because it's a learned convention that maps a physical gesture to "get me the newest". Its strengths: it's where people already are (the top of the feed), needs no button, and gives tactile feedback (the spinner stretching as you pull). Its limits: it's invisible to anyone who doesn't know the gesture or can't perform it, so it shouldn't be the only way to refresh; it can clash with other scroll gestures; and on content that auto-updates it may be redundant. Use it as a familiar, delightful shortcut on feeds where manual refresh makes sense, with clear feedforward (a hint or arrow) and an accessible alternative, not as a hidden, sole control.
Pulling the list down and feeling it spring into a refresh is oddly satisfying - a physical gesture standing in for "show me what's new". That works because it's a convention you already knew and because the interface gave feedback the whole way down. The catch: someone who doesn't know the gesture sees no refresh button at all, which is why pull to refresh should be a shortcut, never the only way.
Pull to refresh succeeds as a convention (Jakob's Law): people learned it across apps, so it transfers. It's well-placed - the gesture starts exactly where you'd look for new content, the top of the feed - and it reuses the existing scroll motion, so it's discoverable by accident. Good implementations add feedforward and feedback: an arrow or stretching spinner that responds to the pull distance, a clear release threshold, and a satisfying snap and load.
Its limitations are real. The gesture is invisible until you try it, so first-timers and people who don't use the convention may never find it; it's hard or impossible for some motor abilities and is inaccessible to keyboard and screen-reader users; and it can conflict with other vertical gestures or fire accidentally. On feeds that update live, a manual pull can also be redundant or confusing.
Design it as an enhancement, not a sole control: provide a visible refresh affordance or auto-update as the baseline, and layer pull to refresh on top for those who expect it. Give clear feedforward as the user pulls, a definite threshold and feedback on success, and ensure an accessible, non-gesture path to the same action. Convention plus a fallback, not a hidden gesture doing essential work alone.