Web Design » Figma » How Do I Make a Horizontal Scroll in Figma Prototype?

How Do I Make a Horizontal Scroll in Figma Prototype?

Last updated on November 29, 2022 @ 1:34 pm

In Figma, a horizontal scroll can be created using the Frame and Prototype tool. Here are some easy and quick steps to make a Horizontal Scroll in Figma:

1. Select the images that you will use by holding the shift key on your keyboard.1. Select the image carrousel that you will use.2. Right-click on the images and select “Group selection” (press Ctrl + G).2, Make it a group selection.3. Right-click on the images again and select “Frame selection” (press Ctrl + Alt +G).3. Make it a frame selection4. Drag the frame to your design and crop the width of the frame.4. Drag the frame to your design and crop the width of the framev5. Go to Prototype Tab and select the Horizontal scrolling under Overflow scrolling option.5. Go to Prototype Tab and select the Horizontal scrolling under Overflow scrolling option6. Click the Present Icon beside the Share button to see the output.6. Click Present7. Enjoy your horizontal scroll effect in Figma!7 Demo of Horizontal ScrollingNow that you have created your frame and set it to horizontal scroll, you can add text by selecting the Text tool and clicking inside the frame.

PRO TIP: If you are not careful, making a horizontal scroll in your Figma prototype can result in lost work or unwanted changes. Be sure to save your work before proceeding.
Morgan Bash

Morgan Bash

Technology enthusiast and Co-Founder of Women Coders SF.