About Card Navigation
CardNav Pro
Create a premium navigation experience with CardNav Pro, a fully responsive expandable card navigation component built specifically for Framer. Designed for modern websites, portfolios, agencies, startups, SaaS products, and premium brands, this component transforms a traditional navigation menu into an engaging interactive experience.
Instead of standard dropdowns, CardNav Pro expands into beautifully designed content cards with smooth animations, customizable layouts, and native Framer controls—allowing anyone to build a professional navigation system without writing code.
Features
Premium expandable card navigation
Fully responsive layouts for Desktop, Tablet, and Phone
Dedicated Open and Closed states for every breakpoint
Native Framer Components, Variants, and Interactions
Smooth expand and collapse animations
Dynamic cards that automatically adapt to content
Unlimited navigation links
Automatic equal-height cards based on the tallest card
Built with Stacks and Auto Layout principles
Animated gradient backgrounds
Fully customizable CTA button
Optional marquee hover animation
Multiple hover animation styles
Native Framer Property Controls
Editable typography using Framer Font Controls
Custom colors, spacing, borders, shadows, and radius
Easy to customize without touching code
Fully Customizable
Every part of the navigation can be edited directly from the Framer Properties panel.
Customize:
Logo
Navigation items
Card titles
Card descriptions
Links
CTA button
Colors
Typography
Border radius
Padding
Spacing
Shadows
Hover animations
Gradient backgrounds
Animation settings
Responsive by Design
CardNav Pro is optimized for every screen size.
Includes dedicated layouts for:
Desktop
Tablet
Phone
Need help or have a question?
Feel free to reach out anytime: