Pull to refresh

Scroll container with pull-down resistance, a ring that draws as you pull, release to refresh with hold and Updated state, a refresh button fallback and a controlled refreshing state.

9:41

Market

Ines12m
Sourdough is out of the oven, six loaves left.
Theo40m
Moved the plant stall next to the fountain today.
Ama1h
Rain cover is up over the book tables.
Ravi2h
Honey tasting starts at eleven.
Lena3h
Lost a blue glove near the cider van.
Oskar4h
Last call for the knife-sharpening queue.

Pull down from the top, or tap refresh

9:41

Market

Ines12m
Sourdough is out of the oven, six loaves left.
Theo40m
Moved the plant stall next to the fountain today.
Ama1h
Rain cover is up over the book tables.
Ravi2h
Honey tasting starts at eleven.
Lena3h
Lost a blue glove near the cider van.
Oskar4h
Last call for the knife-sharpening queue.

Held while refreshing

Install

Pro source requires Pebble Pro. Try the full preview above.

Props

Prop	Type	Default	Description
onRefresh	() => Promise<unknown> \| void	—	PullToRefresh: runs the refresh; the list holds open until it settles.
threshold	number (px)	64	PullToRefresh: pull needed before release refreshes.
refreshing	boolean	—	PullToRefresh: hold the list open in its refreshing state from outside.
PullToRefreshContent	div props	—	The scroll area that can be pulled (only when scrolled to the top).
PullToRefreshButton	button props	—	Refresh without pulling; the accessible path. Disabled while refreshing.

Pro component

Try the full preview above. Editable source and build guides require Pebble Pro.

Buy Pebble Pro — $49 How source access works ↗

← All components Motion & transitions

Pull to refresh

Scroll container with pull-down resistance, a ring that draws as you pull, release to refresh with hold and Updated state, a refresh button fallback and a controlled refreshing state.

9:41

Market

Ines12m
Sourdough is out of the oven, six loaves left.
Theo40m
Moved the plant stall next to the fountain today.
Ama1h
Rain cover is up over the book tables.
Ravi2h
Honey tasting starts at eleven.
Lena3h
Lost a blue glove near the cider van.
Oskar4h
Last call for the knife-sharpening queue.

Pull down from the top, or tap refresh

9:41

Market

Ines12m
Sourdough is out of the oven, six loaves left.
Theo40m
Moved the plant stall next to the fountain today.
Ama1h
Rain cover is up over the book tables.
Ravi2h
Honey tasting starts at eleven.
Lena3h
Lost a blue glove near the cider van.
Oskar4h
Last call for the knife-sharpening queue.

Held while refreshing

Install

Pro source requires Pebble Pro. Try the full preview above.

Props

Prop	Type	Default	Description
onRefresh	() => Promise<unknown> \| void	—	PullToRefresh: runs the refresh; the list holds open until it settles.
threshold	number (px)	64	PullToRefresh: pull needed before release refreshes.
refreshing	boolean	—	PullToRefresh: hold the list open in its refreshing state from outside.
PullToRefreshContent	div props	—	The scroll area that can be pulled (only when scrolled to the top).
PullToRefreshButton	button props	—	Refresh without pulling; the accessible path. Disabled while refreshing.

Pro component

Try the full preview above. Editable source and build guides require Pebble Pro.

Buy Pebble Pro — $49 How source access works ↗

Preview

Install

Props

Pro component

Preview

Install

Props

Pro component