Scroll Snap Stop

Control scroll snap stop behavior

Syntax

visual="snap-stop:[value]"

Values

Value	CSS Output	Description
normal	scroll-snap-stop: normal	Normal stop
always	scroll-snap-stop: always	Always stop

Examples

<div visual="snap-stop:always">Always stop here</div>

Preview

Snap Stop

visual="snap-stop:always" - Control whether to stop at snap point

normal

always

View Code

<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <div space="p:small" visual="bg:primary text:white rounded:small">normal</div>
  <div space="p:small" visual="bg:primary text:white rounded:small">always</div>
</div>