SaaS Nav Kit

SaaS Nav Kit is a navigation set for B2B product sites: announcement bar, navbar, column mega menus, primary and secondary CTAs, and a mobile drawer.

Build menus from two flat lists. A nav item with a Menu key opens a panel made from the Menu links with the same key; Column groups them into up to four columns. An empty key makes a plain link.

Keyboard: Arrow Down opens a menu and moves into it, Up/Down/Home/End move between links, Escape closes and returns focus to the button, and Tab leaving the menu closes it. Left/Right move along the top row.

Mobile drawer (below the width you set, measured on the component): a modal dialog with its own close button. Focus moves in on open, Tab stays inside, Escape or a tap outside closes it and focus returns to the menu button. The page behind does not scroll.

Shadow on scroll and the optional Shrink on scroll follow the page scroll over a distance you choose, without moving the page layout. Reduced motion turns off the shrink and transitions.

Sticky with Top offset: on a Framer page, also set Position: Sticky on the instance with the same Top.

The component listens only on its own element: no window or document listeners. Every text, link and image field can be connected to CMS, and screen reader names are editable.