Skip to content

component

Fold NavBar

By Saira Fayyaz

Details

Summary

Premium folding navigation

Description

Fold Nav is a premium expandable navigation component for Framer designed for portfolios, agencies, studios, SaaS websites and modern landing pages. It starts as a compact floating menu and unfolds into a beautifully structured navigation panel with smooth motion, numbered links, descriptions and a prominent CTA. The layout adapts fluidly across desktop, tablet and mobile. On smaller screens, Fold Nav expands into a comfortable near-full-width panel with large touch targets and an internally scrollable layout when screen height is limited. Features: Compact closed navigation state Smooth folding open/close animation Staggered navigation reveal Responsive desktop, tablet and mobile layouts Active and hover navigation states Optional link descriptions Optional section numbers Premium CTA button Escape key support Internal scrolling on short screens Left or right positioning Reduced-motion accessibility support Dedicated Framer static-renderer fallback Editable properties: Brand name and link Navigation labels, links and descriptions CTA text and destination Accent and surface colors Active surface color Text, muted and border colors Glass effect and blur Closed and expanded panel widths Border radius Top and side offsets Panel padding Animation speed Stagger timing Show/hide numbers and descriptions Fold Nav gives designers a polished alternative to a traditional navbar while remaining highly customizable directly inside Framer.

Introduction

Premium folding navigation

Rank history

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

11001200129219/129/129/139/149/15
  • All · #2179