The Scroll Progress Bar visually represents the progress as a user scrolls up or down a page. It helps users track their progress and navigate lengthy content more easily by showing how far they've scrolled down a page.
Adding a Scroll Progress Bar
From the left panel, click on Add component (Shortcut:
M
)Search for and select Scroll Progress Bar
Click and drag the element onto your canvas
Styling a Scroll Progress Bar Component
Background:
Container: Change the component's container background
PR: Change the Progress Bar's color
Pro Tip: To ensure the Scroll bar appears on all of the necessary pages in your project, pin it at the top of the layers panel.