Back

Open Plugin in Framer

Switch to desktop

Thanks for sharing :)

Liked

Get started on Framer

Get 3 free months on Yearly Subscription by entering "partner25proyearly" code at checkout.

Get started on Framer

Get 3 free months on Yearly Subscription by entering "partner25proyearly" code at checkout.

Scroll edge Fade

This code override allows you to have the edges mask out when scrolling in order to achieve a smooth fade out look on containers with overflow scroll X or Y. Use the demo on the left to test it out.

Adjustable properties

Vertical scroll

Horizontal scroll

How do I use it?

If you have Premium access simply click Open Plugin in Framer and you can insert the component into canvas from the Plugin, if you are purchasing it individually you will receive a Remix link with instructions.

Copy the override code, then go to your Assets tab, click on + and add a new override. Name it Scrollfade and paste the code inside replacing the reference code from Framer.

Create a stack as your main frame where you put your contents, set the overflow to scroll and from the right panel go down to the code overrides section and click on + then select Scrollfade file and for the override select either ScrollfadeX or ScrollfadeY based on your container scrolling direction.

Check out the set up guide

Get started on Framer

Get 3 free months on Yearly Subscription by entering "partner25proyearly" code at checkout.

Framer Plugin

new

Check out our new companion, the Eleveight Supply Framer plugin. Get quick access to all of your components and overrides right within Framer.

Get the Plugin