Pill_ScrollBar

Progress bar that tracks scrolling

Pill Scroll Bar — Minimalist Scroll Tracker Elevate your site's UX with a premium, highly-polished Pill Scroll Bar navigation component. Modeled after clean capsule geometries, this tracker gives visitors a sleek, minimalist visual cue of how far they have scrolled down your page. It is completely collision-proof and engineered to integrate natively with Framer's built-in workspace styling panel. 🌟 Key Features Perfect Canvas Preview : Displays a 50/50 color split inside your Framer design view so you can immediately preview your style combinations without guessing. Flawless Live Execution : Synchronizes perfectly with browser viewports to transition smoothly from 100% unprogressed background to full tracking color. Custom Corner Radius : Use the native slider property to adjust corner roundness. Dial it up for a smooth capsule pill shape or lower it down to fit sharp, boxy grids. Framer-Native Sizing : Adjust component width and height directly using Framer’s right-hand Size panel—its structural geometry scales perfectly without distortion. Collision-Proof Layout : Built to leverage Framer’s native wrapper layout properties, preventing preview collapses or 0px rendering bugs. Instant Sidebar Controls : Toggle your progress tracking and base background colors instantly via built-in color pickers.

Progress bar that tracks scrolling