5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/00zhqb0zqgnk3.js","/creators-assets/_next/static/immutable/chunks/0jb7r9vkvbp9b.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/3y8qjjd_v0fjc.js","/creators-assets/_next/static/immutable/chunks/0_aohzx8_x6oa.js","/creators-assets/_next/static/immutable/chunks/2e6uhasjhfbil.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/0ccg8j7qcn1bd.js","/creators-assets/_next/static/immutable/chunks/1o0ogv90oxalc.js","/creators-assets/_next/static/immutable/chunks/0a1gpscfztyde.js","/creators-assets/_next/static/immutable/chunks/0t3q4gzvfui5n.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/41lhc7ix2xugk.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/30smfjlh8o71p.js","/creators-assets/_next/static/immutable/chunks/3-aog2q7la1hs.js","/creators-assets/_next/static/immutable/chunks/2a2w_2tavj0_e.js","/creators-assets/_next/static/immutable/chunks/3f-jmjjx_9lv_.js","/creators-assets/_next/static/immutable/chunks/10ydirfi9qu21.js","/creators-assets/_next/static/immutable/chunks/0xd4yj8g3g-ci.js","/creators-assets/_next/static/immutable/chunks/0lmmu21lg5-zj.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/05jm9t-fm5ei_.js","/creators-assets/_next/static/immutable/chunks/1pd9j9dvaikmb.js","/creators-assets/_next/static/immutable/chunks/0rfcd366io6r9.js","/creators-assets/_next/static/immutable/chunks/2jl0sg8984bmg.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2q-c5-h7837do.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/2ee50z0bknh40.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/2k4fp8uwg758i.js","/creators-assets/_next/static/immutable/chunks/1dzckq15yxafa.js","/creators-assets/_next/static/immutable/chunks/0g9mmnya96tz6.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:Tcfc,

About This Component

Imagiffy transforms standard photo galleries into interactive experiences by letting you toggle between playful scattered arrangements and clean organized grids with a single click. Each transition flows through smooth, spring-based animations that feel natural and responsive.

What sets Imagiffy apart is the granular control over your scattered layouts. Every image can have its own position, rotation, and offset, letting you create truly unique compositions that reflect your creative vision. Add hover effects with scale, lift, and optional glows, then fine-tune the animation feel with adjustable spring bounce.

The component adapts to your design needs with separate border radius controls for scattered and organized states, custom cursor presets, and box shadow support for depth. Whether starting in scattered mode to surprise visitors or organized mode for immediate clarity, Imagiffy delivers polish and performance through optimized rendering and lazy loading—all while staying fully responsive across devices.

Features

• Click any image to toggle between scattered and organized layouts with smooth spring animations 

• Individually customize each image's position, rotation, and offset in scattered mode 

• Configurable hover effects including scale, lift, and optional outer glow 

• Adjustable spring bounce for fine-tuning animation feel and responsiveness 

• Separate border radius controls for scattered and organized states 

• Custom cursor styles with creative presets (crosshair, grab, zoom-in, pointer, move) 

• Box shadow support for adding depth and dimension to images 

• Choose starting state (scattered or organized) for different use cases 

• Performance-optimized with memoization and lazy loading for smooth interactions 

• Fully customizable image dimensions and background color

Use Cases

• Photography portfolios with interactive gallery presentations 

• Creative agency websites showcasing project work and case studies 

• Product galleries for e-commerce with engaging visual displays 

• Personal portfolio sites with unique, memorable image presentations 

• Landing pages requiring eye-catching, interactive visual elements 

• Team member showcases with playful, dynamic layouts

Technical Highlight

• Built with Framer Motion for smooth, physics-based animations 

• Performance-optimized with React memoization and lazy loading 

• Responsive design that adapts to different screen sizes 

• Customizable spring animations with adjustable bounce and timing 

• Z-index management ensures hovered images appear above others 

• Clean, maintainable code structure ready for the Framer marketplace

There should be a clear Refund Policy on the checkout page.

Refund Policy: Due to the digital nature of this product, all sales are final. Refunds are not offered after purchase.

5a:[["$","$L5d",null,{"post":{"id":"019d430d-6e49-744b-8e3f-8f5f1af280b3","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"f93275c5-a6ac-46b8-8ac4-2c00fe587a2f","name":"Pieart Studio","slug":"pieartstudio","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1367725/ApyTBzVaQ-dgSLXiLW31WkTT6zAh8mkFB3Q6pGTa","badges":["available","studio"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"qqE9FE5A101RHecMZWnW","resolved":true,"title":"Imagiffy","body":"$5e","bodyJson":null,"introduction":"Transform Image Gallery with a Click","slug":"imagiffy","author":{"framerUserId":"f93275c5-a6ac-46b8-8ac4-2c00fe587a2f","name":"Pieart Studio","slug":"pieartstudio","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1367725/ApyTBzVaQ-dgSLXiLW31WkTT6zAh8mkFB3Q6pGTa","badges":["available","studio"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/qqE9FE5A101RHecMZWnW/imagiffy-LNBJO6W3kVjA7ykaFn9nNxPp6C2MCn","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-03-12T05:34:58.287Z","updatedAt":"2026-04-06T03:56:40.496Z","publishedAt":"2026-03-31T08:40:46.921Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://imagiffy.framer.photos/","price":"9","paymentUrl":"https://buy.polar.sh/polar_cl_UoZsXA05NjnHrCRrbeTyEM7ZlBoEJTJXAeyxF21REBE","workshop":true,"categories":[{"id":"66bb31f7-cddf-4a3e-8604-95b3467aecc2","name":"Galleries","slug":"galleries"}],"lastSaveId":"4trkczGOONMJdYcDovvx","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":4,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-03-31T08:40:46.921Z","updatedAt":"2026-03-31T08:40:46.921Z","reported":false}}],"$L5f"]

Suggested for you