Skip to main content

Basic Demos

Default active index​

Vevet Snap supports a default active index. Provide activeIndex (zero-based) when initializing to open the carousel at a specific slide:

Variable Size​

Snap supports slides of varying sizes - they don’t need to be equal in width or height.

Some slides may be larger than their container. In this case, they can be smoothly scrolled:

Vertical​

Snap can operate in either horizontal or vertical orientation:

Centered​

Snap slides can start from the top/left or be centered:

Loop​

Any Snap carousel can be infinite:

Gap​

Snap supports custom gaps between slides. The gap can be set in px, rem, vw, vh or svh:

Grab cursor​

Wheel​

Snap supports wheel control:

Free wheel​

The Snap wheel behavior may differ slightly. For example, after a swipe, the carousel snaps to the nearest magnet, but after a wheel scroll ends, it won't - that part is up to you:

Wheel No-Follow Auto-Throttle​

Sometimes you may want to prevent scrolling through multiple slides at once — Vevet Snap provides automatic wheel throttling to handle that, which works well in most cases:

Wheel No-Follow Numeric Throttle​

Hypersmooth​

One of the best features is track value interpolation, which allows you to make scrolling and swiping as smooth as you want - right out of the box:

Freemode​

Snap freemode allows you to ignore magnets when swiping or wheel scrolling ends:

Sticky freemode​

Snap freemode also supports sticky mode. Users can scroll freely with inertia, but when their interaction ends, magnets take effect, snapping the carousel to the nearest slide:

Rewind​

Enables wrap-around navigation: advancing from the last slide jumps to the first, and going back from the first jumps to the last:

Friction​

Snap supports friction for both wheel and swipe interactions. Friction adds resistance to the user’s scrolling, pulling slides toward their magnets:

Edge Friction​

Snap supports edge friction, making swipe interactions feel more natural and engaging. Edge friction adds resistance when swiping near the carousel’s edges:

Bounce​

You can customize your animation - use any easing you like:

Swipe No Follow​

By default, Snap follows the user's swipe interaction. This behavior can be disabled, causing slides to change only after the interaction ends:

Reverse Swipe​

Both wheel and swipe speeds can be customized:

Slides to Scroll​

Progress​

Snap is a powerful solution for custom carousels. It allows you to track slide progress and animate them however you like:

Virtual​