5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/1rdgef59pv3cw.js","/creators-assets/_next/static/immutable/chunks/0zdv1ssrxkrvj.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/0gxswkth5mc6b.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/36invrtoq879v.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0j6nyijn0flqd.js","/creators-assets/_next/static/immutable/chunks/2b15v_9ruhnys.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3h1dt97hv5ik0.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/0w757zrv0hi6k.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/1h-r9oggqjick.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3sa-o_ztvtkwe.js","/creators-assets/_next/static/immutable/chunks/2051y-i4b0nnm.js"],"PostDetailCard"] 5d:Tdc5,

Arch Image Gallery is an auto-scrolling image carousel with elegant arch-shaped cards. Perfect for creative agencies and work / creative portfolios. With a modern minimalist design, images scroll in an infinite loop with smooth diffused edges, creating a sophisticated gallery effect for your designs.

What It Is

A professional infinite-scrolling image gallery that creates a unique visual experience where arch-shaped cards continuously glide across the screen. Great for a creative portfolio carousel. Unlike traditional carousels or sliders, this component features alternating curved cards with soft fade edges, adding depth and visual polish to your designs. Perfect for portfolios, media showcases, and featured content.

Features for the Framer carousel / image gallery:

Infinite Seamless Loop: Cards scroll continuously with no visible jump or stutter
Arch-Shaped Cards: Alternating curved corners create a distinctive, editorial look
Diffused Fade Edges: Smooth gradient mask on left and right for a polished appearance
Adjustable Speed: Control scroll speed from slow and ambient to fast and dynamic
Responsive Layout: Auto-sizes cards based on container width with cards-per-view control
6 Controls: Complete customization without code

What You Get

Production-ready Framer component
Native Framer property controls (no code files needed)
Responsive design with flexible layout
Smooth, performant animation
Professional default styling
No coding required

Setup

Add component to your canvas
Add images to the card slots (up to 10)
Adjust speed, gap, and arch radius to your liking
Customize fade width for softer or sharper edges
Done!

Key Settings

Layout:

Cards Per View: Number of visible cards (1–8)
Card Height: Height of all cards (150–600px)
Gap: Space between cards (0–50px)
Arch Radius: Curvature of the alternating card corners (20–200px)

Animation:

Speed: Scroll speed from slow to fast (1–100)
Smooth linear motion with seamless looping

Styling:

Fade Width: Control how much the left and right edges diffuse (0–50%)

Use Cases

Portfolio showcases and photography galleries
Hero headers and sections for modern websites
Product image carousels
Agency and creative landing pages
Testimonial or team photo scrollers
Background visual content behind CTAs
Blog post or case study image highlights
Tech, SaaS, or startup landing pages

Best Practices

Use 4–6 images for a balanced, continuous feel
Images with consistent color palettes look most polished
Speed of 40–60 works well for most designs
Fade width of 8–15% creates a subtle, professional edge
Arch radius of 80–120px gives the best curved card shape
Works beautifully on both light and dark backgrounds

59:[["$","$L5c",null,{"post":{"id":"019d787c-98af-7a5e-bf0f-4a44a8ff1368","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"1159add7-a06c-4bd0-b4a6-eaa54b4f3a0e","name":"BasePixel","slug":"basepixel","avatar":"https://framerusercontent.com/avatars/users/1159add7-a06c-4bd0-b4a6-eaa54b4f3a0e/yfvgaNnFR","followed":false,"followsYou":false},"media":[],"resources":[{"id":"6fC6rcutMBm5hEEZ5yKr","resolved":true,"title":"Arch Image Gallery","body":"$5d","bodyJson":null,"introduction":"Cinematic infinite scroll gallery","slug":"arch-image-gallery","author":{"framerUserId":"1159add7-a06c-4bd0-b4a6-eaa54b4f3a0e","name":"BasePixel","slug":"basepixel","avatar":"https://framerusercontent.com/avatars/users/1159add7-a06c-4bd0-b4a6-eaa54b4f3a0e/yfvgaNnFR","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/6fC6rcutMBm5hEEZ5yKr/arch-image-gallery-wvMkidRHKDcwfdP9gucf6OZxpFUIsI","metadata":{"tint":"hsl(0 0% 57%)","aspectRatio":1.3333333333333333}}],"post":null,"createdAt":"2026-04-02T03:27:40.628Z","updatedAt":"2026-06-13T05:42:52.291Z","publishedAt":"2026-04-10T17:42:04.719Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://fierce-assistant-987359.framer.app/preview","price":"3","paymentUrl":"https://buy.stripe.com/4gM28ram2cpVf09gHJ0sU06","workshop":true,"categories":[{"id":"8f93ccfe-423c-47f2-b8ae-79e9e132012f","name":"Carousels","slug":"carousels"}],"lastSaveId":"fH8VpbAY7V0UbrUKQ0jm"}}],"contests":[],"categories":[],"tags":[],"likes":{"count":6,"liked":false},"comments":{"count":2},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-10T17:42:04.719Z","updatedAt":"2026-04-10T17:42:04.719Z","reported":false}}],"$L5e"]

Suggested for you