Navigation (Header)
Professional navigation header examples with responsive layouts, mega menus, and mobile support. Features dropdown menus, categorized links, blog showcases, and sheet-based mobile navigation.
Note
In order to see the full navigation bar, please click on the Full Screen View button ( ) at the top of the style.
This is because the full Navigation is not displayed unless you are above the lg breakpoint.
Style One
Multi-level mega menu navigation with categorized sections. Features large dropdown panels with grouped links, icons, and descriptions. Includes mobile sheet navigation with collapsible sections.
Style Two
Mega menu with icon cards and call-to-action footer. Each dropdown item displayed in a bordered card with icon, perfect for feature showcases. Includes promotional message in dropdown footer.
Style Three
Blog-focused navigation with image previews. Features grid layout of blog posts with thumbnail images in the dropdown menu. Includes hover effects and "View all" call-to-action.
Style Four
Compact dropdown menus with narrow panels. Features single-column dropdown layout with icons and descriptions, ideal for simpler navigation structures. Includes "Learn more" footer links.
Metric
Showcase your key statistics and metrics with professional layouts. Features various grid patterns, card designs, icon integrations, and visual styles to highlight important numbers.
Newsletter
Newsletter subscription blocks featuring email signup forms, privacy notices, and promotional content. Includes split layouts, centered designs, card variations, and form fields with Motion-v animations.