Pattern

Stagger

A stack of lines, each a row of coloured squares that spread apart and collapse back together under a travelling wave. Spacing scales with the wave while square size is capped,…

Try Stagger free →
Runs in your browser. No download. Export when you're ready.

What it does

A stack of lines, each a row of coloured squares that spread apart and collapse back together under a travelling wave. Spacing scales with the wave while square size is capped, so a compressing row shrinks to slivers and converges to a point, while a spreading row leaves black gaps between fixed-size squares — and because the spread varies smoothly from row to row, the k-th square of every row traces a curved streak. Full control over the wave: its shape (Sine hourglass, a narrow travelling Pulse, Triangle, Saw, Bounce or Eased), how many cycles span the stack (below 1 the pinch travels off the ends), where the phase originates (Line, Column, Diagonal, Radial or Random per square), Max Spread, Pinch Floor, the Square Growth cap, Amplitude, an optional Vertical Collapse and Direction (Down / Up / Ping-Pong). Plus squares per line, number of lines, base width / height, square + line gaps, an editable palette with Random / Line / Column / Wave colour assignment and a colour cycle. Loops seamlessly.

Why Vibe Designer

Everything in the browser

No install. Open the Stagger effect and start immediately.

Layer it up

Stagger is a repeating structural pattern — stack it with the rest for something nobody else has.

Animate & export

Seamless looping video (MP4/GIF) and high-res image export, straight from the canvas.

More Pattern effects

Make something with Stagger

Open it in the editor and see it move in seconds.

Open the editor →