Field guide

Making a pattern tile seamlessly

A seamless tile is a small coordinate system whose opposite edges are the same boundary. Anything crossing the left edge must continue from the corresponding position on the right.

Test the tile in at least a three-by-three repeat. A single square cannot reveal a seam, an accidental stripe or a cluster that appears only where four corners meet.

Treat corner objects as one object split four ways. Moving one fragment without the other three breaks continuity even though every piece remains inside the canvas.

Vary local rhythm without creating a larger unintended repeat. If distinctive elements recur in aligned rows, the eye will see the tile dimensions before it sees the motif.

Export at integer pixel dimensions and preview at one-to-one scale. Browser scaling introduces interpolation at the tile boundary and can make a correct file appear to contain a hairline.

A note on this site: the pattern and noise routes export one rectangle at the size you set. They do not yet make that rectangle tile, so its opposite edges will not meet when it is repeated; use the steps above in an editor that offers a wrap-around offset.