EditorialNavbar: Free Navigation Component by Dulaj dilshan

EditorialNavbar brings a refined, magazine-style header to your site. It features deep customization for logos, links, and CTA styles. With built-in responsive controls and custom font support, it fits perfectly into any content-heavy layout.

About this Component

About

EditorialNavbar is a sophisticated, highly flexible navigation component built specifically for Framer projects that need a refined, magazine-style aesthetic. Whether you are building a personal blog, a digital journal, or a clean corporate site, this navbar handles the heavy lifting of responsiveness and branding while keeping your layout looking sharp. It balances classic typography with modern functionality, ensuring your visitors can navigate your content with ease.

What it does

It provides a professional header that adapts seamlessly across desktop, tablet, and mobile devices. The component supports both text and image logos, allows for a customizable set of navigation links, and includes a prominent call to action button. It also features smart UI details like scroll shadows to give your site depth as users move down the page, and adjustable separators to keep your layout organized.

What you can customize

Branding & Links: Choose between a text or image logo, adjust its scale for the perfect fit, and link it to your homepage. You can easily manage your navigation items and set specific links for each.
Call to Action: Show or hide the CTA button and choose from three distinct styles: Text, Outline, or Solid. You have full control over the button background, border colors, hover states, and corner radius.
Layout & Responsiveness: Manually set your mobile and tablet breakpoints. You can also adjust the total navbar height and toggle the canvas visibility for different devices.
Colors & Shadows: Fine tune the colors for your borders, text, and separators. There is also a customizable scroll shadow option to add a premium feel when the user scrolls.
Typography: The component gives you independent font controls for every element, including the logo, navigation links, overlay menu, and the CTA button, so you can match your brand perfectly.