5d:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/1rc641binzbjp.js","/creators-assets/_next/static/immutable/chunks/12ci1vsd8nj4u.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/2ply_q-h6u_2z.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/1pb7yncyfm9fe.js","/creators-assets/_next/static/immutable/chunks/1j6jg0y72xk13.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/26nhnsanh2piz.js","/creators-assets/_next/static/immutable/chunks/03itqfxm4gmj8.js","/creators-assets/_next/static/immutable/chunks/114fkj16mhe97.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/16inv17cv83xq.js","/creators-assets/_next/static/immutable/chunks/2760bhhttj0zo.js","/creators-assets/_next/static/immutable/chunks/3_z6gb0g1nigd.js","/creators-assets/_next/static/immutable/chunks/3vlbhrh3-zofo.js","/creators-assets/_next/static/immutable/chunks/120bipr4k16wv.js","/creators-assets/_next/static/immutable/chunks/3ea2l_ol8wqqa.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/1zr4ew02k6y_l.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/08ajsjh8ypdt2.js","/creators-assets/_next/static/immutable/chunks/1ddgh6mv1wg4x.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/3t6k2_m2gc3-k.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/0w6oa8_ba59u4.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3sa-o_ztvtkwe.js","/creators-assets/_next/static/immutable/chunks/3c3kl-ixsd844.js"],"PostDetailCard"] 5e:T73c,

Why use this

Most menus feel static. This one feels alive.

Smooth morphing animation from button → full menu
Clean staggered link animations
Subtle hover interactions that feel premium
Works perfectly on both desktop and mobile

It’s built to make your UI stand out without overcomplicating things.

Menu Experience

The menu starts as a small rounded button and expands into a full panel with a soft spring animation.

Links appear one after another, creating a polished flow. On hover, a minimal arrow accent adds just enough interaction without being distracting.

At the bottom, you get a secondary section for social or extra links with simple underline effects.

Fully Customizable

Everything is controlled from Framer’s panel, so you don’t need to touch code:

Add or edit navigation links
Add footer/social links
Change colors, fonts, and sizes
Adjust menu width and height
Fine-tune animation speed and feel

It behaves like a native Framer component.

Responsive by Default

Looks good out of the box on all screen sizes.

Automatically adapts to mobile
Custom breakpoint control
Optimized spacing and typography for smaller screens

Built for Real Projects

Closes on outside click (natural behavior)
Lightweight and smooth
Works cleanly in Framer preview and publish
Designed for production use, not just demos

Perfect for

Portfolio websites
Agency landing pages
Personal brands
Modern UI-heavy projects

5a:[["$","$L5d",null,{"post":{"id":"019dd42a-f891-774e-ae34-7201656b2887","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"a8625764-79c7-4d16-901a-16dc988870b6","name":"Ash","slug":"ashutosh-dureja","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2188138/avatar-vac1D3m2g9EmzzrxyLBX8telMQs1eT.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"HC2sodFFn0OtjQWE1RN6","resolved":true,"title":"Awards Morphed Menu","body":"$5e","bodyJson":null,"introduction":"Animated responsive morphing navigation ","slug":"morphed-menu","author":{"framerUserId":"a8625764-79c7-4d16-901a-16dc988870b6","name":"Ash","slug":"ashutosh-dureja","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2188138/avatar-vac1D3m2g9EmzzrxyLBX8telMQs1eT.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/HC2sodFFn0OtjQWE1RN6/morphed-menu-IJbOVWAVcDyX0Ue4HOQP8O7DJ84ove","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-17T13:31:29.838Z","updatedAt":"2026-04-30T03:08:53.485Z","publishedAt":"2026-04-28T12:57:59.185Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/MorphedMenu-HO906X.js@m6RuhIluMBA6ZXKW6jOo","previewUrl":"https://capable-storm-037924.framer.app","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"4c691677-c621-4041-a908-cbc2d3272658","name":"Navigation","slug":"navigation"}],"lastSaveId":"m6RuhIluMBA6ZXKW6jOo","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":166,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-28T12:57:59.185Z","updatedAt":"2026-04-28T12:57:59.185Z","reported":false}}],"$L5f"]

Suggested for you