---
title: "BrutalistNavbar — Framer component · Best of Framer"
description: "$15.00 · Framer component · by Dulaj Design · Navigation. BrutalistNavbar is a high impact, bold navigation component designed for Framer projects that need a distinct, raw aesthetic."
canonical: "https://framer.elliotli.dev/component/brutalistnavbar"
---

[Home](/)/[Components](/components)/[Navigation](/components/category/navigation)/BrutalistNavbar

# BrutalistNavbar

A bold navigation bar edgy brands

[View on Framer](https://framer.com/marketplace/components/brutalistnavbar/?via=elliot-li)

![BrutalistNavbar preview image 1](https://framer.elliotli.dev/og/component/brutalistnavbar/4361565ed62cbdf8/1600x1200.jpg)

## Summary

BrutalistNavbar is a high impact, bold navigation component designed for Framer projects that need a distinct, raw aesthetic.

## Description

**BrutalistNavbar** is a high impact, bold navigation component designed for Framer projects that need a distinct, raw aesthetic. It combines a striking visual style with deep functional control, making it the perfect choice for portfolios, agency sites, or any brand that wants to break away from standard, minimalist designs.

**What it does**It creates a fully responsive navigation bar featuring the signature "brutalist" look—thick borders, high contrast colors, and stark typography. The component handles both desktop and mobile navigation seamlessly, featuring a customizable overlay menu and a dedicated mobile breakpoint to ensure your site looks sharp on every screen size.

**What you can customize**

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-jso3llsv-2rrNkOdlhUQpKc6KlRgGmXFrxy0Jpt)

-   **Content and Links:** Easily edit your logo text, set an external or internal link, and manage separate lists for your desktop and mobile menu items.
    
-   **Layout and Sizing:** Fine tune the bar height, horizontal padding, and gaps between menu items. You can also adjust the "stripe" thickness and specific bottom positioning for a truly custom feel.
    
-   **Styling and Colors:** You have total control over the background, overlay, text, and border colors, plus a dedicated accent color to make your brand pop.
    
-   **Typography:** Set unique fonts for your logo, navigation items, and the mobile overlay to match your site's specific brand identity.
    
-   **Mobile Settings:** Set your preferred mobile breakpoint (defaulted at 590px) and choose whether to show or hide the close button in the mobile menu.
    

**Great for**

-   Design portfolios and creative resumes
    
-   Agency websites with a bold brand identity
    
-   Launch pages for edgy tech or fashion products
    
-   Editorial sites and digital magazines
    
-   Landing pages that want to make a loud first impression
    

**Share your build** If you ship something cool with it, post it on X and tag me @Dulajweb, or send it over. I’d love to see what you create.

**Need help?**Questions or feedback? Reach me anytime: [**dulajdilshan766@gmail.com**](mailto:dulajdilshan766@gmail.com) or on X @Dulajweb

## Rank history [How rankings work →](/terms#rankings)

-   All · #9498

## Details

- **Author**: Dulaj Design
- **Price**: $15.00
- **Published**: 2026-06-05
- **Updated**: 2026-09-03
- **Added**: 2026-05-28
- **Categories**: Navigation

## More like this

-   [Reveal Navigations](/component/reveal-navigations) — Design Supply · Free — A calmer way to open your menu
-   [Collapsible Sidebar](/component/collapsible-sidebar) — Marso Angelov · $10 — Responsive Side Navigation
-   [Dial Picker](/component/dial-picker) — Tanmay Kaper · $14 — A machined dial for your projects
-   [Expanding Side Menu](/component/expanding-side-menu) — Russet Supply · $5 — Animated Framer Navigation