Create smooth scrolling animations with Figma.

Figma recently released this new feature which will save you a lot of time prototyping web pages with Anchor Links.

uxbly
2 min readDec 10, 2020

--

What’s new?

More or less we all know them, in the past the sites were full of anchor links. Now also on Figma, you can create an element that if clicked, automatically scrolls the page and at the desired height.

The new Figma “Scroll to “ feature

Adobe XD has long allowed Anchor Text in his prototype tool. On Figma, on the other hand, it was possible to do it using Smart Animate… but you could say goodbye to your PC’s GPU. Now thanks to Figma’s new “Scroll to” feature you can avoid using dozens of frames to recreate this beautiful and very useful animation.

How to use?

It’s really simple, just add a “Click” interaction in your Figma prototype, as you can see now the new “Scroll To” item is available. Then select the section of your page where you want to stop scrolling.

Figma cares a lot about her community. In fact, like always the team has also created a playground file with which you can practice using the new scroll to function in your next prototypes. Just click here and then click duplicate.

Follow us also on:

InstagramTwitterBehance DribbbleWebsite

--

--