A scroll-to-top button improves navigation on long pages by letting users quickly return to the top with a single click. Here’s how to add one in Flowmo:
Step-by-Step Instructions
Step 1: Add a Button Element
Add any element you'd like to use as your scroll-to-top button — for example, a circle, frame, or icon.
Step 2: Set Position to Fixed
With the button selected:
Go to the right panel
Under Scroll Position, choose Fixed
This keeps the button visible as users scroll through the page.
⚙️ Step 3: Set Constraints
Anchor the button to a corner of the page. For example:
X axis: Left
Y axis: Bottom
Need help? See Constraints Guide
Step 4: Add an Interaction
With the button still selected:
Go to the Interact tab (right panel)
Click Add Interaction
Choose: Click/Tap → parametric animation
Step 5: Configure the Scroll Action
In the new Interaction Panel:
Click on the parametric animation settings
Set Interaction Type to Scroll to Element
Check Animate Scroll for a smooth scrolling effect
Keep the trigger your scroll to top button, and set the Target as your main parent frame (usually the top frame of the page)
Click Update
✅ That’s it!
Now when you preview your project, clicking the button will smoothly scroll back to the top.