Café Wall illusion

Watch straight mortar lines lean as you change the offset

The café wall illusion comes from alternating rows of tiles that are slightly shifted. Start with the canvas, then scroll to uncover how each ingredient strengthens or weakens the effect.

Live canvas

Step 1 · Row offset

Offsetting alternating rows makes the mortar look slanted

Slide the offset to zero and the mortar lines become straight. Nudge it towards half a tile and your brain swears the mortar tilts. This is the core mechanism of the café wall illusion.

Offset per odd row (fraction of tile) 0.50

Step 2 · Mortar strip

Mortar thickness and shade set the illusion strength

Thin mortar that sits midway between the light and dark tiles maximises the contrast cue. Widen or darken it too much and the tilt fades away.

Mortar width (px) 4

Mortar lightness 55%

Step 3 · Tile contrast

Boost the contrast between dark and light tiles

The illusion thrives on a strong contrast between tile rows. Tune the dark and light lightness values here to see how the mortar leans more convincingly.

Dark tile lightness 10%

Light tile lightness 90%

Step 4 · Layout

Change the number and size of tiles

More rows and columns extend the effect across the canvas. Tile size and corner rounding let you match photographs of real café walls.

Rows 14

Columns 30

Tile size (px) 40

Tile corner rounding (px) 0

Step 5 · Pattern variations

Play with different offsets and mortar waves

Alternative offset modes and wavy mortar disrupt or exaggerate the effect. Add jitter to see how small amounts of disorder collapse the illusion.

Offset mode

Wavy mortar amplitude (px) 0

Wavy mortar frequency 8

Row jitter (px, disrupts illusion) 0

Step 6 · Guides and framing

Add reference lines and margins to compare

Reference rulers prove the mortar is level. A generous margin keeps the illusion readable even on small screens.

Show straight reference lines

Board margin (px) 40

Illusion score —

Step 7 · Presets & export

Try classic setups or save your own configuration

Use presets to jump to canonical café wall arrangements or export a snapshot as PNG or SVG to share the illusion.