Component · Carousels and galleries

Scrolling gallery wall that drifts

by Informeek Studio 11 November 2026
Live Drag the wall, then click a project to open it

The prompt

Create a full screen scrolling gallery for a fictional design studio, Parallel Office, on a warm paper background (#efe9df). Fill the screen with a wall of columns, 190px wide (124px on phones) with 18px gaps, rotated -12 degrees and wider than the viewport so no corner shows. Each column holds six project tiles with 12px corners and soft shadows, drawn as flat SVG posters in a bold palette of coral #ff5b3a, ink #1f1a17, cobalt #2f4bff, yellow #ffd23f, green #0f8b6c, pink #ff9ec4 and cream: Bauhaus circles, arches, monograms, dot grids, rising bars and diagonal splits. Alternate columns use different halves of the twelve projects so neighbours never repeat. Every column loops by stacking two copies and drifts on its own, alternating up and down at 16 to 26px per second. Dragging projects the pointer onto the tilted axis so tiles stay under the finger, with momentum after release; the wheel scrolls too. Hover lifts a tile and shows its name. Clicking opens a dialog with the large artwork, discipline, year and a sentence, prev and next buttons, a close button, Escape and a focus trap. Pin a dark frosted bar at the bottom with the studio name and up, pause and down buttons. Pause the drift for reduced motion.

Written by Informeek Studio to recreate this design. Prompts are not deterministic: running it again gives a similar result, not an identical one.

Use it in three steps

  1. Copy the prompt with the button above.
  2. Paste it into your tool, such as v0, Lovable, Bolt or Claude.
  3. Make it yours by replacing the posters with thumbnails of your own projects.

About this scrolling gallery

A scrolling gallery wall shows the volume of a body of work before anyone reads a word. This one tilts the whole wall a little and lets every column drift on its own, some up and some down, so the page is always gently moving even when nobody touches it. Each column is two identical stacks of tiles, and the offset simply wraps around, which is why the wall never ends.

Grab it anywhere and it follows your finger, even though it is turned, because the drag is measured along the tilted axis rather than straight up and down. Fling it and it glides to a stop. Click a tile and the drift pauses while a dialog opens with the project at full size and a line about the work, with arrows to step through the rest.

Why the prompt works

  • It explains the endless loop, two stacked copies per column and a wrapped offset.
  • It keeps neighbours different by giving alternate columns different projects.
  • It projects the drag onto the tilt, the detail that makes a rotated wall feel natural.
  • It includes the dialog behaviour, Escape, focus trap and a pause button.

Where to use it

Studio and agency homepages, illustration portfolios, poster archives and event photo walls with a dozen or more pieces.

The prompt is shared under CC BY 4.0. Reuse it freely, including commercially, with a credit linking back to this page.

Keep exploring

More prompts like this

See the collection →