5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.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/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.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/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.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:T85f,

About this Component

Spiral Gallery is a responsive WebGL media gallery that wraps images and videos around a 3D helix and drives the full sequence from page scroll. Cards climb through the spiral while guide lines counter-move and oversized headlines sweep across the viewport for a cinematic, editorial feel.

Perfect For

• Creative portfolios • Agency & studio sites • Case studies • Fashion & editorial • Art direction • Product showcases

Key Features

• Mix images and muted looping videos across up to 9 media slots • Individual link for every media item • Optional ripple, refraction, dent, tilt, glow, and grow hover interaction • Custom top/bottom headlines and tagline • Native Framer font controls and text-position controls • Background, text, guide color, and guide opacity controls • Responsive desktop, tablet, and mobile framing • Adjustable scroll follow delay and WebGL resolution • Static-renderer support and offscreen rendering pause • Natural page scrolling with no scroll hijacking

How It Works

Place the component inside a 100vh sticky frame, then place that frame inside a taller scrolling section. The height of the outer section determines the scroll duration. Add your media, links, copy, and styling from Framer’s property panel, then publish.

Questions? Reach out at hasanwali6890@gmail.com

Refund Policy

All sales are final upon purchase as this is a non-tangible digital product. A refund is offered only if the component has a critical technical failure that prevents its core function and cannot be resolved within a reasonable timeframe. Refunds are not issued for buyer’s remorse, aesthetic preference, or modifications made after purchase. Report confirmed technical failures with evidence within 14 days of purchase.

5a:[["$","$L5d",null,{"post":{"id":"01a0a973-0568-7229-b74e-455e6d140381","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"10767168-8381-4f2b-9206-2d6c344aae23","name":"Hasan Wali","slug":"hasan-wali","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/98885/avatar-WMhG6M5ak8XBca7qBEj8qK9rJSB8o7.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"ql8ePGRjOEp8qB47QQjb","resolved":true,"title":"Spiral Gallery FX","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Preview Demo ","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://jumpy-customer-555913.framer.app","target":"_blank"}}]}]},{"type":"paragraph","content":[{"type":"text","text":"About this Component","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Spiral Gallery is a responsive WebGL media gallery that wraps images and videos around a 3D helix and drives the full sequence from page scroll. Cards climb through the spiral while guide lines counter-move and oversized headlines sweep across the viewport for a cinematic, editorial feel."}]},{"type":"paragraph","content":[{"type":"text","text":"Perfect For","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"• Creative portfolios • Agency & studio sites • Case studies • Fashion & editorial • Art direction • Product showcases"}]},{"type":"paragraph","content":[{"type":"text","text":"Key Features","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"• Mix images and muted looping videos across up to 9 media slots • Individual link for every media item • Optional ripple, refraction, dent, tilt, glow, and grow hover interaction • Custom top/bottom headlines and tagline • Native Framer font controls and text-position controls • Background, text, guide color, and guide opacity controls • Responsive desktop, tablet, and mobile framing • Adjustable scroll follow delay and WebGL resolution • Static-renderer support and offscreen rendering pause • Natural page scrolling with no scroll hijacking"}]},{"type":"paragraph","content":[{"type":"text","text":"How It Works","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Place the component inside a 100vh sticky frame, then place that frame inside a taller scrolling section. The height of the outer section determines the scroll duration. Add your media, links, copy, and styling from Framer’s property panel, then publish."}]},{"type":"paragraph","content":[{"type":"text","text":"Questions?","marks":[{"type":"bold"}]},{"type":"text","text":" Reach out at "},{"type":"text","text":"hasanwali6890@gmail.com","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"mailto:hasanwali6890@gmail.com","target":"_blank"}}]}]},{"type":"paragraph","content":[{"type":"text","text":"Refund Policy","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"All sales are final upon purchase as this is a non-tangible digital product. A refund is offered only if the component has a critical technical failure that prevents its core function and cannot be resolved within a reasonable timeframe. Refunds are not issued for buyer’s remorse, aesthetic preference, or modifications made after purchase. Report confirmed technical failures with evidence within 14 days of purchase."}]},{"type":"paragraph"}]},"introduction":"3D media gallery driven by scroll","slug":"spiral-gallery-fx","author":{"framerUserId":"10767168-8381-4f2b-9206-2d6c344aae23","name":"Hasan Wali","slug":"hasan-wali","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/98885/avatar-WMhG6M5ak8XBca7qBEj8qK9rJSB8o7.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/10767168-8381-4f2b-9206-2d6c344aae23/01a0a972-b2ae-753e-a6c4-b1aefeb7b30e.png","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-09-16T09:01:22.036Z","updatedAt":"2026-09-16T09:01:22.036Z","publishedAt":"2026-09-16T09:01:22.033Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://jumpy-customer-555913.framer.app","price":"14","paymentUrl":"https://contra.com/payment-link/eZgNeHPq-spiral-gallery","workshop":false,"categories":[{"id":"8f93ccfe-423c-47f2-b8ae-79e9e132012f","name":"Carousels","slug":"carousels"}],"lastSaveId":"FnK8TpzjbKbL8LZYBr5h","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-16T09:01:22.664Z","updatedAt":"2026-09-16T09:01:22.664Z","reported":false}}],"$L5f"]

Suggested for you