Static editor · Media · 2 min read

Tile a pattern on a screen

Repeat a small image across a whole surface instead of stretching it. Add the picture, switch to the Tile tab and set the size of each repeat.

Click the plus

With your mockup open in Static, click the + on the surface. The + in the Media section on the right does the same.

A billboard mockup with an empty green surface and a round plus button in its centreA billboard mockup with an empty green surface and a round plus button in its centre
An empty surface shows a + button in its centre.

Upload a small image

Click Upload File and choose the picture you want to repeat. A small square works best: a pattern or a texture. Adjust media opens as soon as the file is in.

The Add your design prompt with the Upload File button over the faded billboardThe Add your design prompt with the Upload File button over the faded billboard
Upload File is under Add your design.

Open the Tile tab

Under Replace Image or Video there are three icon tabs. Click the third one, with four small squares. The preview now repeats your picture. The black frame shows the part that lands on the surface.

The Adjust media window with the third tab selected and the picture repeated in its preview, 100 percent scaleThe Adjust media window with the third tab selected and the picture repeated in its preview, 100 percent scale
The Tile tab repeats the picture in the preview.

Lower the scale

Type a smaller number in the Scale field, for example 60, and press Enter. The repeats get smaller and more of them fit on the surface.

The Adjust media window with Scale set to 60 and a denser pattern in the previewThe Adjust media window with Scale set to 60 and a denser pattern in the preview
At 60 percent the pattern is denser.

Move the pattern

Drag inside the preview to slide the pattern until a full repeat sits where you want it.

The Adjust media window after the pattern was dragged to a new position, Scale still 60The Adjust media window after the pattern was dragged to a new position, Scale still 60
Dragging shifts the whole pattern.

Close the window

Click the × in the top-right corner of Adjust media. The pattern now covers the surface, and its thumbnail sits in the Media section.

The finished billboard covered in the repeating pattern, with the pattern thumbnail in the Media section on the rightThe finished billboard covered in the repeating pattern, with the pattern thumbnail in the Media section on the right
The surface is covered edge to edge.

Questions

Which image works best for a repeating pattern?

A small square picture, such as a pattern or a texture.

Where is the Tile tab?

Under Replace Image or Video in Adjust media there are three icon tabs. The Tile tab is the third one, with four small squares.

How do I make the repeats smaller?

Type a smaller number in the Scale field, for example 60, and press Enter. More repeats then fit on the surface.

How do I avoid visible seams?

Use an image whose left and right edges match and whose top and bottom edges match. Then the repeats join without visible seams.

Try it in the Static mockup editor

Photo mockups in the browser: drop a design in, export a picture.

Open editor