5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/05lj3a0qaa006.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/382a8k30zyobj.js","/creators-assets/_next/static/immutable/chunks/368p63l4oh_7-.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/228u8o-g1d1_g.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/413kuej600yyw.js","/creators-assets/_next/static/immutable/chunks/02hyzon6wywme.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:T976,

Interactive magnetic 3D hero.

Elevate your portfolio or brand with this striking, high-end Interactive 3D Hero section. Designed with a distinct streetwear and urban aesthetic, this component uses advanced Framer Motion spring physics to create a hyper-realistic "gaze" effect—making your 3D avatar or product dynamically track the user's cursor.

Built for maximum impact and ultimate ease of use, it allows complete customization without touching a single line of code. From precise X and Y positioning of the 3D focal point to full typographic control, you can tailor every detail directly from the Framer properties panel to perfectly match your brand's identity.

Key Features

Cursor-Tracking Gaze Effect: Seamless 3D rotation powered by spring physics that naturally follows the mouse.
Magnetic Hover Interaction: The central avatar features a built-in magnetic pull when users hover nearby, adding a premium tactile feel.
Absolute Position Control: Dial in the exact X and Y coordinates for the 3D image to achieve a flawless layout on any viewport.
Total Typography Freedom: Effortlessly change fonts, weights, colors, and sizing for the title, subtitle, and CTA button right from the side panel.
Fully Responsive: Smart use of clamp() values ensures your typography and layout scale perfectly across desktop, tablet, and mobile breakpoints.
Plug & Play: Zero coding required. Connect your own links, drop in your transparent PNG/WebP, and hit publish.

Contact & Support

If you need help setting up this component, encounter any bugs, or want to inquire about custom high-end Framer development and 3D web experiences, feel free to reach out.

Inquiries: enekolekue16@gmail.com

Legal & License

Standard License By purchasing or downloading this component, you are granted a non-exclusive, non-transferable license to use it in personal and commercial projects.

You may: Use this component in unlimited end products (such as client websites or personal portfolios).

5a:[["$","$L5d",null,{"post":{"id":"019f3b9d-c8e6-723e-a562-42cb592c4e35","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"6f02a19f-43a4-4050-be76-5fbc6cbcb524","name":"Eneko Lekue","slug":"eneko-lekue","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1580373/avatar-PMCQVO0jd8uNhzBKUIXFju4xGQrRI5.jpg","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"f2jt07Yizubp9wZHIXbp","resolved":true,"title":"Interactive 3D Hero","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Interactive magnetic 3D hero."}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Elevate your portfolio or brand with this striking, high-end Interactive 3D Hero section. Designed with a distinct streetwear and urban aesthetic, this component uses advanced Framer Motion spring physics to create a hyper-realistic \"gaze\" effect—making your 3D avatar or product dynamically track the user's cursor."}]},{"type":"paragraph","content":[{"type":"text","text":"Built for maximum impact and ultimate ease of use, it allows complete customization without touching a single line of code. From precise X and Y positioning of the 3D focal point to full typographic control, you can tailor every detail directly from the Framer properties panel to perfectly match your brand's identity."}]},{"type":"customHeading","content":[{"type":"text","text":"Key Features","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Cursor-Tracking Gaze Effect:","marks":[{"type":"bold"}]},{"type":"text","text":" Seamless 3D rotation powered by spring physics that naturally follows the mouse."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Magnetic Hover Interaction:","marks":[{"type":"bold"}]},{"type":"text","text":" The central avatar features a built-in magnetic pull when users hover nearby, adding a premium tactile feel."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Absolute Position Control:","marks":[{"type":"bold"}]},{"type":"text","text":" Dial in the exact X and Y coordinates for the 3D image to achieve a flawless layout on any viewport."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Total Typography Freedom:","marks":[{"type":"bold"}]},{"type":"text","text":" Effortlessly change fonts, weights, colors, and sizing for the title, subtitle, and CTA button right from the side panel."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Fully Responsive:","marks":[{"type":"bold"}]},{"type":"text","text":" Smart use of "},{"type":"text","text":"clamp()","marks":[{"type":"code"}]},{"type":"text","text":" values ensures your typography and layout scale perfectly across desktop, tablet, and mobile breakpoints."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Plug & Play:","marks":[{"type":"bold"}]},{"type":"text","text":" Zero coding required. Connect your own links, drop in your transparent PNG/WebP, and hit publish."}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Contact & Support","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"If you need help setting up this component, encounter any bugs, or want to inquire about custom high-end Framer development and 3D web experiences, feel free to reach out."}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Inquiries:","marks":[{"type":"bold"}]},{"type":"text","text":" enekolekue16@gmail.com"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Legal & License","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Standard License","marks":[{"type":"bold"}]},{"type":"text","text":" By purchasing or downloading this component, you are granted a non-exclusive, non-transferable license to use it in personal and commercial projects."}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"You may:","marks":[{"type":"bold"}]},{"type":"text","text":" Use this component in unlimited end products (such as client websites or personal portfolios)."}]}]}]}]},"introduction":"Interactive 3D avatar hero banner.","slug":"interactive-3d-hero","author":{"framerUserId":"6f02a19f-43a4-4050-be76-5fbc6cbcb524","name":"Eneko Lekue","slug":"eneko-lekue","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1580373/avatar-PMCQVO0jd8uNhzBKUIXFju4xGQrRI5.jpg","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/6f02a19f-43a4-4050-be76-5fbc6cbcb524/5s3r3ore","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-07-07T08:07:04.092Z","updatedAt":"2026-07-07T09:47:27.249Z","publishedAt":"2026-07-07T08:07:04.088Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://strong-timing-972123.framer.app/","price":"6","paymentUrl":"https://contra.com/payment-link/qgcwxab6-framer-component-hero-3-d","workshop":false,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"2q0z0YdvVaTPQHco07Jj","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":6,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-07T08:07:04.166Z","updatedAt":"2026-07-07T08:07:04.166Z","reported":false}}],"$L5f"]

Suggested for you