Gravity Pill Navbar

A navbar with a little more gravity.

Gravity Pill Navbar is an interactive navigation component built around a smooth expanding top menu and playful physics-based navigation pills.

Open the navbar and each menu item drops naturally into place. Grab a pill, drag it around or throw it across the menu — gravity brings it back while keeping the interaction fast and responsive.

✨ What’s inside

• Physics-based falling navigation pills

• Drag, throw, bounce and collision interactions

• Smooth expanding top-attached navbar

• Adjustable throw return speed

• Individual styling for every pill

• Custom fill, text, font, padding and radius per item

• Border, shadow and hover controls

• Editable logo and menu trigger

• Custom open / closed navbar sizing

• Adjustable gravity, bounce, friction and air resistance

• Click-outside and Escape-to-close behavior

• Reduced-motion support

• Responsive Framer-ready structure

• Static-render friendly setup

Made for

Creative portfolios, studio websites, personal sites, experimental landing pages and interactive Framer projects.

Easy to customize

Change every navigation pill independently, upload your own logo, adjust the navbar dimensions and fine-tune the entire physics system directly from Framer.

Keywords: gravity navbar, falling pill navbar, animated navbar, interactive navigation, physics menu, draggable menu, pill navigation, creative navbar, portfolio navigation, expanding navbar, Framer navbar, Framer component, interactive menu, falling menu, motion navigation