---
title: "Magnet Side Navbar — Free Framer component · Best of Framer"
description: "Free Framer component · by Matt · Navigation. About Magnet Side Navbar is a floating vertical navigation with a smooth magnify effect."
canonical: "https://framer.elliotli.dev/component/magnet-side-navbar"
---

[Home](/)/[Components](/components)/[Navigation](/components/category/navigation)/Magnet Side Navbar

# Magnet Side Navbar

Turn navigation into an experience

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

![Magnet Side Navbar preview image 1](https://framer.elliotli.dev/og/component/magnet-side-navbar/9343e1c596a35080/1600x1200.jpg)

## Summary

About Magnet Side Navbar is a floating vertical navigation with a smooth magnify effect.

## Description

## About

Magnet Side Navbar is a floating vertical navigation with a smooth magnify effect. The hovered item grows together with nearby links while an animated label slides into view. It includes light and dark themes, left and right label positions, individually hideable navigation items, and a dedicated mobile variant with permanently visible labels.

## What you can customize

Built entirely with native Framer elements, so everything stays editable directly on the canvas. Customize the icons, hover icons, labels, links, colors, sizes, spacing, radius, shadows, typography, animations, item visibility, label direction, themes, layout, and responsive behavior without touching code.

## Great for (examples)

Just a few ideas, use it anywhere you want navigation to feel more interactive:

-   Portfolio websites
    
-   Creative agency websites
    
-   Personal websites
    
-   Designer portfolios
    
-   Developer portfolios
    
-   Studio websites
    
-   Experimental landing pages
    
-   Minimal websites
    
-   Product showcases
    
-   Modern one-page websites
    
-   Premium Framer templates
    
-   Interactive web experiences
    

## Share your build

If you ship something cool with it, post it on X and tag me [@Matthias\_Oel](https://x.com/Matthias_Oel), or send it over. I’d love to see what you create.

## Need help?

Questions or feedback? Reach me anytime: [matthias@lmvision.de](mailto:matthias@lmvision.de) or on X [@Matthias\_Oel.](https://x.com/Matthias_Oel)

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

-   All · #1621

## Details

- **Author**: Matt
- **Published**: 2026-07-10
- **Updated**: 2026-10-30
- **Added**: 2026-07-10
- **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
