60:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/3bibva_hl5iqy.js","/creators-assets/_next/static/immutable/chunks/125_ce2ese0y_.js","/creators-assets/_next/static/immutable/chunks/3_vedwwik9kwx.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3o8r_4s04xi2z.js","/creators-assets/_next/static/immutable/chunks/2fjwvdycfnlp5.js","/creators-assets/_next/static/immutable/chunks/0r10zdsyx-ur2.js","/creators-assets/_next/static/immutable/chunks/1cuuzi60s_xh3.js","/creators-assets/_next/static/immutable/chunks/0h4bpdjiu20m1.js","/creators-assets/_next/static/immutable/chunks/3kkqflhmmpg9p.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/3s2zch-ye42_l.js","/creators-assets/_next/static/immutable/chunks/2rczsbgoa3afm.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/00ebnw8devfa0.js","/creators-assets/_next/static/immutable/chunks/43086d68m86ee.js","/creators-assets/_next/static/immutable/chunks/0ib-rcz4b0eq3.js","/creators-assets/_next/static/immutable/chunks/3kdp38xspo624.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/1sugay03d_r-_.js","/creators-assets/_next/static/immutable/chunks/0xd4yj8g3g-ci.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/0mq1i7guy9x38.js","/creators-assets/_next/static/immutable/chunks/3o5qsyzxffd89.js","/creators-assets/_next/static/immutable/chunks/16kvwplszpb49.js","/creators-assets/_next/static/immutable/chunks/0mh5jvwc33gcz.js","/creators-assets/_next/static/immutable/chunks/32_fdxpqhpsw-.js","/creators-assets/_next/static/immutable/chunks/3um5ae_udgvki.js","/creators-assets/_next/static/immutable/chunks/09nuoamhdspq1.js","/creators-assets/_next/static/immutable/chunks/2t30dt_pkt6vy.js","/creators-assets/_next/static/immutable/chunks/2m-zjjbxmagmn.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/3eh5q_6ksmw0l.js","/creators-assets/_next/static/immutable/chunks/3uclgk1u5qk0z.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/2rdaqkxiyeq_6.js","/creators-assets/_next/static/immutable/chunks/0lx7q3wrd-vbb.js","/creators-assets/_next/static/immutable/chunks/31uxrh745m-yq.js"],"S"] 61:T670,

Give any 2D logo a life of its own — in 3D.

Drop in your own SVG and this component extrudes it into a fully lit, metallic 3D object: real PBR reflections, a hand-tuned gradient material, and a shadow that's rendered live from the object's actual silhouette as it turns — not a static blob underneath it. Visitors can click and drag to spin it themselves; let go and it keeps turning with momentum before settling back into its slow auto-rotation.

Built entirely in Three.js, so it's a real 3D scene — not an embedded video or GIF.

Customization at a glance:

- Upload any single-path SVG logo (or keep the built-in one)

- Extrusion depth, bevel size & smoothness

- Two-stop gradient with adjustable angle

- Metalness, roughness, clearcoat, and highlight sharpness

- Reflection intensity/blur, ambient & key light strength

- Rotation speed and 3-axis tilt

- Shadow opacity, distance, and blur

- Camera zoom

Whether you're building a hero section for a product launch, an agency portfolio intro, a SaaS landing page, or just want a logo reveal that feels a little more alive than a static PNG, this drops straight in and adapts to your brand's colors and lighting in seconds.

Works at any size, from a small favicon-style badge to a full-bleed hero, and supports touch dragging on mobile out of the box.

Live demo: Click here

Questions or ideas for a feature? Reach out — happy to help you get the most out of it.

5f:["$","$L60",null,{"value":{"fallback":{"$inf$activity-creator-2ef93f2c-586b-4fa3-8e65-7a456da6d8c3-all:/unified/creator/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/activity/":[{"data":[{"id":"01a02026-7189-70c0-a530-032b42aae06c","type":"site.created","target":{"type":"site","id":"16996","preview":"kobielak.pl","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/01a02026-52ff-7345-a766-b0aabe14d7ee.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","slug":"kobielakdesign","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"site","visibility":"public","startedAt":"2026-08-20T17:09:45.481Z","latestAt":"2026-08-20T17:09:45.481Z"},{"id":"019ff084-d630-746d-9a15-d69d38e7bfa5","type":"creator.followed","target":{"type":"creator","id":"dff3b05c-02d0-4ed8-a095-26a214570759","preview":"Joseph Todaro","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/dff3b05c-02d0-4ed8-a095-26a214570759/krr0ac8j","slug":"jatodaro","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","slug":"kobielakdesign","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-11T11:11:05.256Z","latestAt":"2026-08-11T11:11:05.256Z"},{"id":"019fe721-7f5f-70d1-b289-80485c7b66b3","type":"component.created","target":{"type":"component","id":"G5XwulSZgzYP5Z1AGNWU","preview":"Rotating 3D Logo","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/019feca1-27c8-736f-896d-c170b5a6839c.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","slug":"kobielakdesign","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-08-09T15:26:00.031Z","latestAt":"2026-08-09T15:26:00.031Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:2ef93f2c-586b-4fa3-8e65-7a456da6d8c3:/unified/posts/?creator=2ef93f2c-586b-4fa3-8e65-7a456da6d8c3&with=reposts":[{"data":[{"id":"01a0d386-b509-7719-a8d6-91973efc4631","title":null,"body":"

I guess its official now, am excited about this journey! 🎉

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"I guess its official now, am excited about this journey! "},{"type":"emoji","attrs":{"name":"tada","emoji":"🎉"}}]}]},"author":{"framerUserId":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","slug":"kobielakdesign","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/01a0d385-8bdd-75ca-ba19-29660b86ef3c.png","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1080,"height":1350}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-24T13:06:55.885Z","updatedAt":"2026-09-24T13:06:55.885Z"},{"id":"01a02026-6f8b-745e-9382-5a91283b8a1c","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","slug":"kobielakdesign","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"16996","resolved":true,"title":"kobielak.pl","body":"

My own portfolio showcasing the details am focusing on during the craft work

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"My own portfolio showcasing the details am focusing on during the craft work "}]}]},"introduction":"","slug":"kobielak-pl","author":{"framerUserId":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","slug":"kobielakdesign","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/01a02026-52ff-7345-a766-b0aabe14d7ee.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-08-20T17:09:44.459Z","updatedAt":"2026-08-20T17:09:44.459Z","publishedAt":"2026-08-20T17:09:44.455Z","featuredAt":null,"approvedAt":null,"type":"site","attributes":{"url":"https://kobielak.pl/","categories":[{"id":"6a730e3d-bdf2-42a2-ab42-eee5ef39b694","name":"Portfolio","slug":"portfolio"}],"mainCategory":null,"tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-08-20T17:09:44.971Z","updatedAt":"2026-08-20T17:09:44.971Z"},{"id":"019ff00c-f8d2-71cd-bdb0-4e0d2ca42597","title":null,"body":"

Happy to publish my first component on Framer! 🎉

Meet the Rotating 3D Logo — turns any SVG you upload into a spinning 3D metallic logo with a real-time shadow and drag-to-spin. Fully customizable via property controls.

See the results

Curious what's next? Feel free to follow along! 👋

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Happy to publish my first component on Framer! ","marks":[{"type":"bold"}]},{"type":"emoji","attrs":{"name":"tada","emoji":"🎉"}}]},{"type":"paragraph","content":[{"type":"text","text":"Meet the Rotating 3D Logo — turns any SVG you upload into a spinning 3D metallic logo with a real-time shadow and drag-to-spin. Fully customizable via property controls."}]},{"type":"paragraph","content":[{"type":"text","text":"See the results","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://framer.link/B16M7KD","target":"_blank"}}]}]},{"type":"paragraph","content":[{"type":"text","text":"Curious what's next? Feel free to follow along! "},{"type":"emoji","attrs":{"name":"wave","emoji":"👋"}}]}]},"author":{"framerUserId":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","slug":"kobielakdesign","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/mnfabmpMTDtzekKxf2Txb6dE2KKk7DNm9YcWOz43UGo.m3u8","metadata":{"posterUrl":"https://image.mux.com/mnfabmpMTDtzekKxf2Txb6dE2KKk7DNm9YcWOz43UGo/thumbnail.webp?time=5.5","aspectRatio":"16:9","duration":11.823222}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":7,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":2,"edited":true,"editedAt":"2026-08-11T09:17:52.814Z","createdAt":"2026-08-11T09:00:09.818Z","updatedAt":"2026-08-11T09:17:52.814Z"},{"id":"019fe721-5010-73ce-9b54-5759c4efbc95","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","slug":"kobielakdesign","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"G5XwulSZgzYP5Z1AGNWU","resolved":true,"title":"Rotating 3D Logo","body":"$61","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Give any 2D logo a life of its own — in 3D."}]},{"type":"paragraph","content":[{"type":"text","text":"Drop in your own SVG and this component extrudes it into a fully lit, metallic 3D object: real PBR reflections, a hand-tuned gradient material, and a shadow that's rendered live from the object's actual silhouette as it turns — not a static blob underneath it. Visitors can click and drag to spin it themselves; let go and it keeps turning with momentum before settling back into its slow auto-rotation."}]},{"type":"paragraph","content":[{"type":"text","text":"Built entirely in Three.js, so it's a real 3D scene — not an embedded video or GIF."}]},{"type":"paragraph","content":[{"type":"text","text":"Customization at a glance:"}]},{"type":"paragraph","content":[{"type":"text","text":"- Upload any single-path SVG logo (or keep the built-in one)"}]},{"type":"paragraph","content":[{"type":"text","text":"- Extrusion depth, bevel size & smoothness"}]},{"type":"paragraph","content":[{"type":"text","text":"- Two-stop gradient with adjustable angle"}]},{"type":"paragraph","content":[{"type":"text","text":"- Metalness, roughness, clearcoat, and highlight sharpness"}]},{"type":"paragraph","content":[{"type":"text","text":"- Reflection intensity/blur, ambient & key light strength"}]},{"type":"paragraph","content":[{"type":"text","text":"- Rotation speed and 3-axis tilt"}]},{"type":"paragraph","content":[{"type":"text","text":"- Shadow opacity, distance, and blur"}]},{"type":"paragraph","content":[{"type":"text","text":"- Camera zoom"}]},{"type":"paragraph","content":[{"type":"text","text":"Whether you're building a hero section for a product launch, an agency portfolio intro, a SaaS landing page, or just want a logo reveal that feels a little more alive than a static PNG, this drops straight in and adapts to your brand's colors and lighting in seconds."}]},{"type":"paragraph","content":[{"type":"text","text":"Works at any size, from a small favicon-style badge to a full-bleed hero, and supports touch dragging on mobile out of the box."}]},{"type":"paragraph","content":[{"type":"text","text":"Live demo:"},{"type":"text","text":" Click here","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://rotating3dlogo.framer.website/","target":"_blank"}}]}]},{"type":"paragraph","content":[{"type":"text","text":"Questions or ideas for a feature? Reach out — happy to help you get the most out of it."}]}]},"introduction":"Metallic 3D logo from any SVG","slug":"rotating-3d-logo","author":{"framerUserId":"2ef93f2c-586b-4fa3-8e65-7a456da6d8c3","name":"Dominik Kobielak","slug":"kobielakdesign","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/wsjc366r","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2ef93f2c-586b-4fa3-8e65-7a456da6d8c3/019feca1-27c8-736f-896d-c170b5a6839c.png","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-08-09T15:25:28.717Z","updatedAt":"2026-08-11T08:29:54.131Z","publishedAt":"2026-08-09T15:25:28.619Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://rotating3dlogo.framer.website/","price":"10","paymentUrl":"https://buy.stripe.com/7sY8wHeTs2vafZV3MF4c800","workshop":false,"categories":[{"id":"323e97d6-f443-488c-8661-794a9a83a20f","name":"Effects","slug":"effects"}],"lastSaveId":"bYlZeDyK58E98DUsgYZC","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":3,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-08-09T15:25:47.921Z","updatedAt":"2026-08-09T15:25:47.921Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L62"}]