24 / SCROLL BEHAVIOR
Scroll Snap
The problem
Free scrolling through a gallery leaves items awkwardly half-visible, requiring fiddly adjustment.
The solution
Scroll snaps to align each item with the viewport.
Experiment
Task: Scroll the carousel horizontally.
FREE SCROLL
01
02
03
04
05
snapFALSE
alignnone
SNAP
01
02
03
04
05
snapTRUE
aligncenter
Play with the values
How it works
Seen in
Carousels
Image carousels land squarely on each slide.
Onboarding
Full-screen intro panels snap one at a time.
Galleries
Horizontal media rows align items after each swipe.
Section scrolling
Landing pages snap between full-height sections.