Track Scroll
Scroll Progress is a flexible UI component that displays real-time scroll progress as users move through a page. It supports horizontal bars, vertical bars, and circular indicators, making it suitable for a wide range of layouts and UX needs.
You can position it anywhere on the screen, apply solid colors or gradients, adjust thickness and radius, and even display a percentage inside the circular style. It works globally on the page or within a specific scroll container.
Horizontal, vertical, and circular progress styles
Fixed positioning with multiple placement options
Optional gradient support
Custom thickness and corner radius
Circular percentage indicator
Lightweight and non-intrusive
Supports custom scroll containers
Blog and article pages
Documentation sites
Long-form landing pages
Dashboards and analytics views
Reading progress indicators
Use subtle colors or gradients for minimal UI distraction
Place horizontal bars at the top for reading-focused pages
Use circular indicators for dashboards or floating UI elements
One Scroll Progress component
Horizontal, vertical, and circular modes
Gradient and solid color options
Flexible positioning controls
Framer designers and developers
Content-heavy websites
UX-focused interfaces
No-code builders needing scroll feedback
Plaiter
