Skip to content

component

Scroll SideNav

By Ecem Gececi

Details

Summary

Scroll SideNav brings elegant section navigation to your Framer projects.

Description

Scroll SideNav brings elegant section navigation to your Framer projects. Built for portfolios, case studies, and one-pagers that deserve seamless scrolling and a touch of motion. Features Smooth scrolling between sections Hover-reveal labels for a minimal, elegant feel Auto section highlighting (ScrollSpy) Fully customizable colors, fonts, and alignment Lightweight, responsive, and built with Framer Motion How to Use Paste Scroll SideNav onto your page. Set it to Fixed Position (left or right). In the Sections list, add your labels and matching section IDs (e.g, “info”, “projects”, “services”, “about”, “testimonials”, “contact”). Give each target frame on your page the corresponding Section ID . Adjust colors, font, and alignment to fit your style. (This is how I used it for the preview.) Preview your site, the nav will scroll smoothly and highlight active sections automatically. Scroll SideNav - Guide

Introduction

Side Navigation Component

Rank history

Daily rank per list, from the first snapshot — lower is better.

110012001300132448/148/228/309/79/15
  • All · #2497