Introduction
With this component for Framer, you can create dynamic and visually engaging progress indicators that adapt seamlessly to your designs. The Scroll Progress Bar is a simple framer resource, yet versatile, providing a customizable scrolling experience that enhances interactivity and user engagement.
Don’t have the component yet? Purchase it here.
Getting Started
Click on the remix link you received from Lemon Squeezy which will open the project in Framer. Grab the component from the canvas by copying and pasting it into your own project. Customize the component through the built in property controls to fit your style and needs.
Thickness & Color Control
The Scroll Progress Bar provides full control over thickness and color settings. Adjust the bar’s thickness to match your layout and choose from solid, gradient, or multi-color schemes to perfectly integrate with your design’s palette.
Solid Mode offers a single, clean progress bar that grows as the user scrolls. This mode is ideal for minimal and modern designs, ensuring a seamless and elegant user experience.
Gradient Mode allows you to use a customizable gradient that fills dynamically as the user scrolls. With its smooth transitions, this mode adds an extra layer of sophistication to your design.
Multi-Color Mode divides the progress bar into distinct segments that reveal themselves progressively as users scroll. Perfect for bold and interactive designs, this mode brings a vibrant and dynamic touch to your projects.
