Multimedia Production Tools

How to Make a Seamless Pattern Tile

  1. Launch Adobe Photoshop.

  2. Under the File menu select New (command-N) document. Set the pixel size to width 96 and height 96.

  3. Choose a light blue foreground color and a dark blue background color.

  4. Choose Filter -> Render -> Clouds. If you don't see clouds do a command-Z (undo) and select a darker foreground color and a lighter background color. Your tile should look something like this:

  5. Choose Filter -> Other -> Offset to check where the seams occur. Click the Wrap Around radio button. Enter these amounts: 48 pixels right and 48 pixels down.

  6. Your offset tile should look something like this:

  7. There are many ways to clean up a seam. You could use the Clone, Smudge or Airbrush tool. To use the Clone tool, select a portion of the image (click on the image and hold down the option key) and clone (paint with the Clone tool) over the seams. The Smudge tool: Just like in finger painting, you drag the Smudge tool across the seam a few times. The Airbrush tool: select a medium brush size and paint over the seams.

  8. What we did was to select a part of the image and copy and paste it over the seam. In this method, it is best to use the Lasso selection tool to make a small, irregular selection. We applied a Select -> Feather of 2 pixels. You can use the arrow keys to nudge the selection or copy and paste it over the seam. Continue patching in this way until all the seams are covered. Hint: You can hold down the option key and drag the selection to make a copy of it.

  9. Now to check out how your patterned tile looks when it is tiled open a new file set to 300 by 300 pixels. Go back to your tile file and do a Select -> All (command-A). Then select Edit -> Define Pattern.

  10. Select the new 300 by 300 pixel file. Select Edit -> Fill. In the Fill dialog box, select Use Pattern, Opacity, 100%, and Mode Normal. If you see any seams, clean them up in the original file then try the tile out again.

  11. An easier way to make seamless tiles is to use Terrazzo. Terrazzo is an Adobe Photoshop plug-in for creating seamless tileable patterns from any source imagery. Users may choose from 17 mathematical symmetries to create patterns from information in the source image, which results in kaleidoscopic textures harmonious with the source image. Terrazzo is an indispensable tool for Web page backgrounds, 3D texture mapping, multimedia and graphics effects.

  12. This photograph was used as the image source to create the tile you see below using Terrazzo.

    The final tile.