Reveal Nav

Stacked nav with animated content cards

How it behaves — the nav items animate in with a staggered entrance on load, each item has a hover state that shifts the difference-blend rectangle, and hovering reveals the content card with cascading text and image transitions. Responsiveness — the whole component scales proportionally to whatever container size you give it. No breakpoint fiddling needed. Fonts — all four font controls (Nav, Heading, Subheading, Body) accept any Framer font, so it works with custom typefaces. Button links — the CTA button per item supports Framer's native link picker, so it works with page links, sections, and external URLs. Item count — supports up to 8 nav items. No dependencies — pure React, no external libraries. Lightweight and fast.

Stacked nav with animated content cards