5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/3jpuro209qqra.js","/creators-assets/_next/static/immutable/chunks/2qlox892e2j_q.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/07e2f_v4-u-we.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/3orcs6a8eyfvz.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/120zfy8hqrcwf.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/2c_4he4mvu2r0.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3q7g04e77g4lf.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/0lmnldnlzsgok.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/0z2hzm-7v_g2c.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/2_qutx8yar-up.js","/creators-assets/_next/static/immutable/chunks/0p4vy6mn-x9zs.js"],"PostDetailCard"] 5d:T732,

About Infinite 2D Grid

A wall is easy in a screenshot. The cost shows up when people start moving through it.

Infinite 2D Grid renders the tiles in and around the viewport, then repeats your connected Framer items across an endless 2D surface. The wall feels open, while the page only carries the tiles people can reach.

Drag, wheel movement, momentum, parallax, press feedback, and focus states are handled without loading the full wall at once. Built for galleries, archives, portfolio indexes, and visual walls that need endless movement without page weight.

Why Infinite 2D Grid

Viewport tiles plus buffer
The component mounts the tiles in and around the viewport, instead of loading the full wall into the page.
Movement stays direct
Drag, wheel movement, momentum, parallax, press states, and scroll feedback run through browser frames and transform updates.
Interaction stays usable
Links, pointer access, keyboard focus, and screen reader access stay active on usable tiles, while offscreen duplicates are disabled.
Framer states are covered
Static render, canvas preview, reduced motion, item limits, ratios, columns, gaps, variation, and focus styling are handled.

Good fit / Wrong fit

Good fit: visual walls, galleries, archives, and indexes that need clean 2D movement.
Wrong fit: fixed editorial grids, precise masonry layouts, or media-heavy walls where media loading matters more than movement.

Contact & Support

Questions about setup, product, or licensing: alexandre@madebymash.com

59:[["$","$L5c",null,{"post":{"id":"019a788c-7436-7c4c-804c-f36c8e1c092e","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"74b6f1af-e323-4a02-9c54-46f511512cea","name":"ALEXANDRE","slug":"alexherbigneaux","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/74b6f1af-e323-4a02-9c54-46f511512cea/dbon2qx8","followed":false,"followsYou":false},"media":[],"resources":[{"id":"fe3hPjvyETNKXKhO6Sdc","resolved":true,"title":"Infinite 2D Grid","body":"$5d","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"About Infinite 2D Grid"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"A wall is easy in a screenshot. The cost shows up when people start moving through it."}]},{"type":"paragraph","content":[{"type":"text","text":"Infinite 2D Grid renders the tiles in and around the viewport, then repeats your connected Framer items across an endless 2D surface. The wall feels open, while the page only carries the tiles people can reach."}]},{"type":"paragraph","content":[{"type":"text","text":"Drag, wheel movement, momentum, parallax, press feedback, and focus states are handled without loading the full wall at once. Built for galleries, archives, portfolio indexes, and visual walls that need endless movement without page weight."}]},{"type":"customHeading","content":[{"type":"text","text":"Why Infinite 2D Grid"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Viewport tiles plus buffer","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"The component mounts the tiles in and around the viewport, instead of loading the full wall into the page."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Movement stays direct","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Drag, wheel movement, momentum, parallax, press states, and scroll feedback run through browser frames and transform updates."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Interaction stays usable","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Links, pointer access, keyboard focus, and screen reader access stay active on usable tiles, while offscreen duplicates are disabled."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Framer states are covered","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Static render, canvas preview, reduced motion, item limits, ratios, columns, gaps, variation, and focus styling are handled."}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Good fit / Wrong fit"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Good fit:","marks":[{"type":"bold"}]},{"type":"text","text":" visual walls, galleries, archives, and indexes that need clean 2D movement."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Wrong fit:","marks":[{"type":"bold"}]},{"type":"text","text":" fixed editorial grids, precise masonry layouts, or media-heavy walls where media loading matters more than movement."}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Contact & Support"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Questions about setup, product, or licensing: "},{"type":"text","text":"alexandre@madebymash.com","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"mailto:alexandre@madebymash.com","target":"_blank"}}]}]}]},"introduction":"Media wall, kept light","slug":"infinite-2d-grid","author":{"framerUserId":"74b6f1af-e323-4a02-9c54-46f511512cea","name":"ALEXANDRE","slug":"alexherbigneaux","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/74b6f1af-e323-4a02-9c54-46f511512cea/dbon2qx8","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/fe3hPjvyETNKXKhO6Sdc/infinite-2d-grid-m5sXoFFqP27r87G3tQq3BuWUCKe2KG"}],"post":null,"createdAt":"2025-11-03T09:19:36.894Z","updatedAt":"2026-08-12T11:46:37.406Z","publishedAt":"2025-11-12T14:51:02.070Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://infinite2dgridbymash.framer.website/","price":"29","paymentUrl":"https://buy.polar.sh/polar_cl_SrWeAE4wnXFORNeYZeaW66yp63OZp1M4WgVni0py7Xg?locale=en","workshop":false,"categories":[{"id":"4fdfe3ed-ecd1-4761-a9df-b36c0c38e974","name":"Layout","slug":"layout"}],"lastSaveId":"L750AgZLVY4M4w75XxCw"}}],"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":"2025-11-12T14:51:02.070Z","updatedAt":"2025-11-12T14:51:02.070Z","reported":false}}],"$L5e"]

Suggested for you