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:T808,

Zoom Image Preloader transforms a stack of images into a smooth cinematic zoom‑in sequence, perfect as a fullscreen preloader or intro reveal. Each image appears by scaling up from 0 while its content gently zooms out from 2x, creating the feeling of a camera moving through your visuals. Ideal for bold hero intros, portfolio transitions, and any layout where images should feel alive.

Drop it into your canvas, plug in your images, tweak the delay and transition, and you get a polished, motion‑driven loading experience in seconds—no extra code needed.

✨ You can fully control the timing and feel directly from the right panel:

Key Features

Cinematic Zoom‑In Sequence – Each image scales in from 0 while its content zooms out from 2x for a camera‑like motion.
Stack-Based Image Flow – Feed a stack of images and let the component play them as a smooth, choreographed sequence.
Global Motion Control – Fine‑tune type, ease, and duration with a single transition prop powered by Framer Motion.
Adjustable Timing – Set the delay between images for subtle fades or fast, snappy transitions.
Drop‑In Workflow – Add it to your canvas, plug images, tweak a few values, and you’re production‑ready with no custom code.

🔧 Props / Controls

Images: Stack your images to build the zoom sequence
Delay between images: Time offset between each image’s reveal
Transition: Global motion settings (type, ease, duration) applied to all images

Best for

Hero section preloaders and intros
Case study and portfolio transitions
Visual storytelling sequences
Any page where you want images to appear in a choreographed zoom‑in animation

5a:[["$","$L5d",null,{"post":{"id":"019c6be7-6eef-7c8d-9a9a-9287d257d0d5","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"0eb656fb-73e8-4667-a092-6e5a6dd30127","name":"Quentin Hocdé","slug":"quentinhocde","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1859271/affa86058560ca6abc73686df596697c-ov0KLyBeFNqA0rSHPF7SQ6DUVUhZon","followed":false,"followsYou":false},"media":[],"resources":[{"id":"OFgT9SGYIZcvthsw4kSs","resolved":true,"title":"Zoom Images Preload","body":"$5e","bodyJson":null,"introduction":"smooth cinematic zoom‑in sequence","slug":"zoom-images-preload","author":{"framerUserId":"0eb656fb-73e8-4667-a092-6e5a6dd30127","name":"Quentin Hocdé","slug":"quentinhocde","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1859271/affa86058560ca6abc73686df596697c-ov0KLyBeFNqA0rSHPF7SQ6DUVUhZon","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/OFgT9SGYIZcvthsw4kSs/zoom-images-preload-QG9y7VALlK56gaz80QDyXHlH1pU8AI","metadata":{"tint":{"h":210,"s":70,"l":60},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-02-16T20:28:32.271Z","updatedAt":"2026-03-12T14:26:01.075Z","publishedAt":"2026-02-17T14:00:55.279Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://re.chujiqiqi.com/m/ZoomImagesPreloader-gGO2kJ.js@GRz7i7Ogsnhv4uL7taMF","previewUrl":"https://zoom-images-preloader.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"b42eea44-0ea9-4372-9981-70c9e68577c1","name":"Loaders","slug":"loaders"}],"lastSaveId":"GRz7i7Ogsnhv4uL7taMF","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":10,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-02-17T14:00:55.279Z","updatedAt":"2026-02-17T14:00:55.279Z","reported":false}}],"$L5f"]

Suggested for you