🪄

Place this component inside the canvas

Set a Z index of -1 for best results

Add a

Drag

and

Snap

scroll

effect to your Framer projects.

know more

know more

Try it Right Here ♥ Try it Right Here ♥

Scroll effects in your Framer projects with ease

A Framer Component

Add effects with the ease of Framer components.

Easy Modifications

Add, order, and move your sections easily.

Property Control

Adjust it to your projects.

Designed for Framer

Powered by Framer and React.

How to use Drag & Snap

1

Connect the frames you want to add the effects to.

2

Change the property controls as needed.

3

And that's it! Enjoy your new effects.

FAQ

What is Drag&Snap?

What functionalities does Drag&Snap offer?

What are the benefits of using Drag&Snap?

Limitations of Drag&Snap

The way D&S is built limits the use of certain Framer functions, such as: Scroll section-dependent spawn effects, scroll overflow, ability to drag the Ticker, use of overlays.


Please keep this in mind before using D&S in your projects.

Changelog

Last update

Version 3.3.1

6 days ago

  • Prevention of false vertical movements caused by touches, these caused jumps between frames.

  • Improvements in the autoscroll function. Jumps are now avoided if you are interacting with a frame.

Version 3.2

1 week ago

  • Optimization of use on mobile devices

Version 3.1

1 month ago

  • Adjusted: Auto scroll control

Version 3

2 months ago

  • Added: Auto scroll, auto scroll intervals and infinite scroll in auto scroll.

  • Performance improvements.

Version 2

2 months ago

  • Mobile compatibility.

  • Performance improvements.

Version 1

3 months ago

  • Initial release of the component.

  • Implementation of drag and snap effects.

  • Support for the dragEffect and snapEffect props.

  • Support for the children, childrenWidth, and heightOfChildren props.

  • Support for responsive design.

  • Support for efficient performance.

  • Support for versatility.

Add a

Drag

and

Snap

scroll

effect to your Framer projects.

know more

know more

Scroll effects in your Framer projects with ease

A Framer Component

Add effects with the ease of Framer components.

Easy Modifications

Add, order, and move your sections easily.

Property Control

Adjust it to your projects.

Designed for Framer

Powered by Framer and React.

How to use Drag & Snap

1

Connect the frames you want to add the effects to.

2

Change the property controls as needed.

3

And that's it! Enjoy your new effects.

FAQ

What is Drag&Snap?

What functionalities does Drag&Snap offer?

What are the benefits of using Drag&Snap?

Limitations of Drag&Snap

The way D&S is built limits the use of certain Framer functions, such as: Scroll section-dependent spawn effects, scroll overflow, ability to drag the Ticker, use of overlays.


Please keep this in mind before using D&S in your projects.

Changelog

Last update

Version 3.3.1

6 days ago

  • Prevention of false vertical movements caused by touches, these caused jumps between frames.

  • Improvements in the autoscroll function. Jumps are now avoided if you are interacting with a frame.

Version 3.2

1 week ago

  • Optimization of use on mobile devices

Version 3.1

1 month ago

  • Adjusted: Auto scroll control

Version 3

2 months ago

  • Added: Auto scroll, auto scroll intervals and infinite scroll in auto scroll.

  • Performance improvements.

Version 2

2 months ago

  • Mobile compatibility.

  • Performance improvements.

Version 1

3 months ago

  • Initial release of the component.

  • Implementation of drag and snap effects.

  • Support for the dragEffect and snapEffect props.

  • Support for the children, childrenWidth, and heightOfChildren props.

  • Support for responsive design.

  • Support for efficient performance.

  • Support for versatility.

Add a Drag and Snap scroll effect to your Framer projects.

know more

Buy D&S

Scroll effects in your Framer projects with ease

A Framer Component

Add effects with the ease of Framer components.

Easy Modifications

Add, order, and move your sections easily.

Property Control

Adjust it to your projects.

Designed for Framer

Powered by Framer and React.

How to use Drag & Snap

Connect the frames you want to add the effects to.

Change the property controls as needed.

And that's it! Enjoy your new effects.

FAQ

What is Drag&Snap?

What functionalities does Drag&Snap offer?

What are the benefits of using Drag&Snap?

Limitations of Drag&Snap

The way D&S is built limits the use of certain Framer functions, such as: Scroll section-dependent spawn effects, scroll overflow, ability to drag the Ticker, use of overlays.


Please keep this in mind before using D&S in your projects.

Changelog

Version 1

3 months ago

  • Initial release of the component.

  • Implementation of drag and snap effects.

  • Support for the dragEffect and snapEffect props.

  • Support for the children, childrenWidth, and heightOfChildren props.

  • Support for responsive design.

  • Support for efficient performance.

  • Support for versatility.