---
title: "Nav Bar with Shaders — Free Framer component · Best of Framer"
description: "Free Framer component · by 1655 Studio · Navigation. Nav Bar with Shaders is Nav Bar with Framer Shaders Power as a mask, you can change the colors of the shader and play with it."
canonical: "https://framer.elliotli.dev/component/nav-bar-with-shaders"
---

[Home](/)/[Components](/components)/[Navigation](/components/category/navigation)/Nav Bar with Shaders

# Nav Bar with Shaders

a CTA which can be playful and fun

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

![Nav Bar with Shaders preview image 1](https://framer.elliotli.dev/og/component/nav-bar-with-shaders/9b264f4965a6bd67/1600x1200.jpg)

## Summary

Nav Bar with Shaders is Nav Bar with Framer Shaders Power as a mask, you can change the colors of the shader and play with it.

## Description

Nav Bar with Shaders is Nav Bar with Framer Shaders Power as a mask, you can change the colors of the shader and play with it.

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

-   All · #4916

## Details

- **Author**: 1655 Studio
- **Published**: 2026-05-12
- **Updated**: 2026-05-12
- **Added**: 2026-05-06
- **Categories**: Navigation

## More like this

-   [Status badge](/component/status-badge) — Lera · Free — Ready-to-use status badge component built for data-heavy interfaces.
-   [Magnetic Icons Dock](/component/magnetic-icons-dock) — Lera · $10 — Icon tiles magnetic navigation
-   [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