---
title: "InfinityGallery — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Oleksandr Demydov · Galleries. InfinityGallery is a full-screen masonry gallery that moves with your cursor."
canonical: "https://framer.elliotli.dev/component/infinitygallery"
---

[Home](/)/[Components](/components)/[Galleries](/components/category/galleries)/InfinityGallery

# InfinityGallery

Infinite masonry gallery

[View on Framer](https://framer.com/marketplace/components/infinitygallery/?via=elliot-li)

![InfinityGallery preview image 1](https://framer.elliotli.dev/og/component/infinitygallery/d49f0f4cd1a53246/1600x1200.jpg)

## Summary

InfinityGallery is a full-screen masonry gallery that moves with your cursor.

## Description

InfinityGallery is a full-screen masonry gallery that moves with your cursor. Point anywhere inside the component and the grid drifts in that direction — slower near the center, faster toward the edges. Release and it glides to a stop. Switch to Auto Scroll and it runs continuously at any angle, no interaction required.

Images can be uploaded directly inside Framer using the Images control — no external hosting required. Alternatively, switch to URL Folder mode and load images from any CDN or server using a simple sequential naming convention (p1.jpg, p2.jpg, …).

**Key Features**

**Images**

-   Upload images directly in Framer — drag in files or pick from project assets
    
-   Or load from a folder URL with sequential naming (p1.jpg, p2.jpg, …)
    

**Layout**

-   Masonry grid with configurable column count and width
    
-   Seamless 3×3 tiling — no visible seams or jumps at any speed
    
-   Optional grid tilt (−45° to +45°) for editorial-style layouts
    

**Movement**

-   Physics-based cursor control with inertia and deadzone
    
-   4 movement modes: XY, X only, Y only, Auto Scroll
    
-   Adjustable speed, max speed, and smoothness
    

**Hover Effects**

-   Scale card on hover
    
-   Zoom image on hover
    
-   Color overlay with adjustable color and opacity
    
-   Grayscale desaturation
    

**Lightbox**

-   Full-screen overlay with blur backdrop
    
-   Prev / Next navigation buttons
    
-   Keyboard navigation — ← → to browse, Esc to close
    
-   Renders above all page elements (no z-index conflicts)
    

**Polish**

-   Smooth fade-in animation as images load
    
-   Fallback color while loading or on broken links
    
-   Optional card shadow
    
-   Animations fully disabled on canvas and during export
    

**Setup**

1.  Add the component to your Framer project.
    
2.  **Upload mode (default):** click the + button in the Images control in the properties panel and add your photos.
    
3.  **URL Folder mode:** switch Source to "URL Folder", set Folder URL to your image host base path, and set Images Count to match the number of files (p1.jpg … pN.jpg).
    
4.  Adjust columns and column width per breakpoint in Framer's responsive panel.
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #7928

## Details

- **Author**: Oleksandr Demydov
- **Price**: $10.00
- **Published**: 2026-06-17
- **Updated**: 2026-06-17
- **Added**: 2026-06-17
- **Categories**: Galleries

## More like this

-   [Infinite Pan Canvas](/component/infinite-pan-canvas) — Aisol Studio · $15 — Endless image wall you can drag
-   [CMS Photo Pile](/component/cms-photo-pile) — Marso Angelov · $10 — Draggable Photo Gallery
-   [CMS Infinity Grid](/component/cms-infinity-grid) — 55N · Free — Boundless exploration.
-   [Endless CMS Reel](/component/endless-cms-reel) — Marso Angelov · $10 — Horizontal Momentum Gallery