5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/3jpuro209qqra.js","/creators-assets/_next/static/immutable/chunks/077g_l9cwe8hz.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/2ouyrs2yz196q.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/3orcs6a8eyfvz.js","/creators-assets/_next/static/immutable/chunks/3-tcb9ouhlqkm.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/120zfy8hqrcwf.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/1p31g3z3kho5v.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/2885u7skzba5_.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/1fo1h_o5odhhk.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/0v-er0xp5q011.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/2rwbpl35w01v4.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/0djs9po3g19ek.js","/creators-assets/_next/static/immutable/chunks/1_ej2mmnwnp37.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/2_qutx8yar-up.js","/creators-assets/_next/static/immutable/chunks/0bcmpcsc4ih7d.js"],"PostDetailCard"] 5d:T985,

3D Portfolio Showcase: Interactive Project Gallery

Transform your portfolio into an immersive 3D experience with this premium Framer component. Built with THREE.js, it creates a stunning floating gallery where your projects come to life in three-dimensional space.

Key Features

Interactive 3D Scene: Projects are displayed as floating cards in 3D space with smooth parallax effects and physics-based animations. Navigate through your work using a mouse, keyboard, touch gestures, or scroll.

Dual View Modes: Effortlessly switch between Scatter View (a dynamic overview of all projects) and Detail View(a focused carousel with an expandable bottom sheet for project information).

Fully Customizable: Control every aspect directly through Framer’s property panel. Adjust colors, fonts, themes (light/dark), project data, and custom content slots for each project’s detail view.

Responsive Bottom Sheet: Features an Apple Maps-style expandable sheet that reveals project details, complete with smooth spring animations and intuitive drag/scroll interactions.

Admin Mode: Includes an optional admin panel to easily add or remove projects directly on the canvas during development.

Performance Optimized: A capped pixel ratio and highly efficient rendering ensure smooth 60fps animations, even when displaying multiple projects.

Touch & Gesture Support: Full support for mobile interactions, including swipe navigation, pinch gestures, and touch-friendly controls.

Keyboard Navigation: Use arrow keys for project navigation, Enter to expand details, and Escape to close.

Custom Cursors: Context-aware cursor indicators dynamically change based on interaction state (expand, drag, navigate).

Perfect For

Creative Agencies showcasing client work.

Designers presenting portfolio pieces.

Photographers displaying curated collections.

Product Designers highlighting case studies and projects.

Any Creative Professional wanting a memorable, standout portfolio experience.

59:[["$","$L5c",null,{"post":{"id":"01a047dc-d45b-72ef-8a46-547cdd73232c","title":null,"body":"

please like <3

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"please like <3"}]}]},"author":{"framerUserId":"c4150f45-6c92-4e43-8d24-bf3d9b6e5524","name":"Julio Aragoza","slug":"julio-aragoza","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/c4150f45-6c92-4e43-8d24-bf3d9b6e5524/hqj5j778","badges":["available","studio"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"o1jt3BgbLWoQJjnkkR8e","resolved":true,"title":"Portfolio Pro","body":"$5d","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"3D Portfolio Showcase: Interactive Project Gallery","marks":[{"type":"bold"}]}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Transform your portfolio into an immersive 3D experience with this premium Framer component. Built with THREE.js, it creates a stunning floating gallery where your projects come to life in three-dimensional space."}]},{"type":"customHeading","content":[{"type":"text","text":"Key Features","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Interactive 3D Scene:","marks":[{"type":"bold"}]},{"type":"text","text":" Projects are displayed as floating cards in 3D space with smooth parallax effects and physics-based animations. Navigate through your work using a mouse, keyboard, touch gestures, or scroll."}]},{"type":"paragraph","content":[{"type":"text","text":"Dual View Modes:","marks":[{"type":"bold"}]},{"type":"text","text":" Effortlessly switch between "},{"type":"text","text":"Scatter View","marks":[{"type":"italic"}]},{"type":"text","text":" (a dynamic overview of all projects) and "},{"type":"text","text":"Detail View","marks":[{"type":"italic"}]},{"type":"text","text":"(a focused carousel with an expandable bottom sheet for project information)."}]},{"type":"paragraph","content":[{"type":"text","text":"Fully Customizable:","marks":[{"type":"bold"}]},{"type":"text","text":" Control every aspect directly through Framer’s property panel. Adjust colors, fonts, themes (light/dark), project data, and custom content slots for each project’s detail view."}]},{"type":"paragraph","content":[{"type":"text","text":"Responsive Bottom Sheet:","marks":[{"type":"bold"}]},{"type":"text","text":" Features an Apple Maps-style expandable sheet that reveals project details, complete with smooth spring animations and intuitive drag/scroll interactions."}]},{"type":"paragraph","content":[{"type":"text","text":"Admin Mode:","marks":[{"type":"bold"}]},{"type":"text","text":" Includes an optional admin panel to easily add or remove projects directly on the canvas during development."}]},{"type":"paragraph","content":[{"type":"text","text":"Performance Optimized:","marks":[{"type":"bold"}]},{"type":"text","text":" A capped pixel ratio and highly efficient rendering ensure smooth 60fps animations, even when displaying multiple projects."}]},{"type":"paragraph","content":[{"type":"text","text":"Touch & Gesture Support:","marks":[{"type":"bold"}]},{"type":"text","text":" Full support for mobile interactions, including swipe navigation, pinch gestures, and touch-friendly controls."}]},{"type":"paragraph","content":[{"type":"text","text":"Keyboard Navigation:","marks":[{"type":"bold"}]},{"type":"text","text":" Use arrow keys for project navigation, "},{"type":"text","text":"Enter","marks":[{"type":"code"}]},{"type":"text","text":" to expand details, and "},{"type":"text","text":"Escape","marks":[{"type":"code"}]},{"type":"text","text":" to close."}]},{"type":"paragraph","content":[{"type":"text","text":"Custom Cursors:","marks":[{"type":"bold"}]},{"type":"text","text":" Context-aware cursor indicators dynamically change based on interaction state (expand, drag, navigate)."}]},{"type":"customHeading","content":[{"type":"text","text":"Perfect For","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Creative Agencies","marks":[{"type":"bold"}]},{"type":"text","text":" showcasing client work."}]},{"type":"paragraph","content":[{"type":"text","text":"Designers","marks":[{"type":"bold"}]},{"type":"text","text":" presenting portfolio pieces."}]},{"type":"paragraph","content":[{"type":"text","text":"Photographers","marks":[{"type":"bold"}]},{"type":"text","text":" displaying curated collections."}]},{"type":"paragraph","content":[{"type":"text","text":"Product Designers","marks":[{"type":"bold"}]},{"type":"text","text":" highlighting case studies and projects."}]},{"type":"paragraph","content":[{"type":"text","text":"Any Creative Professional","marks":[{"type":"bold"}]},{"type":"text","text":" wanting a memorable, standout portfolio experience."}]}]},"introduction":"3D Project showcase","slug":"portfolio-pro","author":{"framerUserId":"c4150f45-6c92-4e43-8d24-bf3d9b6e5524","name":"Julio Aragoza","slug":"julio-aragoza","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/c4150f45-6c92-4e43-8d24-bf3d9b6e5524/hqj5j778","badges":["available","studio"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/c4150f45-6c92-4e43-8d24-bf3d9b6e5524/01a047db-b1fb-73e8-ac45-953d283c7782.png"}],"post":null,"createdAt":"2026-08-28T10:14:09.209Z","updatedAt":"2026-08-28T10:57:23.584Z","publishedAt":"2026-08-28T10:14:09.205Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://awesome-library-294721.framer.app","price":"24","paymentUrl":"https://contra.com/payment-link/bbCkHaK9-portfolio-pro-3-d-portfolio","workshop":true,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"xjcg1HnMqkjIlSgciqV3"}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":2},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-08-28T10:14:09.755Z","updatedAt":"2026-08-28T10:14:09.755Z","reported":false}}],"$L5e"]

Suggested for you