Scrollspy Navigation

The Scrollspy Navigation component delivers precise section tracking, fluid indicator animations, and complete styling freedom for Framer single-page and multi-page layouts.

The Scrollspy Navigation component delivers precise section tracking, fluid indicator animations, and complete styling freedom for Framer single-page and multi-page layouts. Key Features Smart Scrollspy: Powered by IntersectionObserver for zero-lag section detection. Smooth-scrolls on click and works seamlessly with libraries like Lenis. Cross-Site Routing: Automatically handles internal pages, scroll anchors, and external URLs. Leverages Framer's native routing for flash-free page transitions. Animated Indicator: Features a customizable active indicator with smooth sliding and scaling. Full control over background, active text color, and scaling behavior. Conditional Visibility: Define explicit Start and End sections to automatically show or hide the navigation (e.g., hide in hero or footer). Independent Offsets: Separate trigger offsets for active section detection vs. component visibility for precise scroll control. Flexible Item Layout: Unlimited items. Display as text + icon, icon-only, or text-only. Position icons top, bottom, left, or right. Automatic SVG Recoloring: Automatically syncs single-color SVG icons with your active and default text colors. Togglable for multi-color assets. Advanced Styling: Full typography control, container layout settings (padding, border radius, native drop shadows), and flexible 100% width/height frame fitting. Refund Policy Due to the digital nature of this product, all sales are final. Please review the full Refund & Cancellation Policy before purchasing. You can find it [here] .

Smart Onepager & Crosssite Nav