Creating Seamless Tiles

First off, let me define a "seamless tile" for those of you coming here for curiousity's sake. A seamless tile is merely an image that repeating without a seam or an area in which you can tell the image is repeating. Tiling is used mainly when employing a complicated design or pattern for the background of a layout. Making these tiles seamless makes the layout considerably more professional-looking and overall more asthetically pleasing.

A Seamless Tile from Scratch

  1. Open a new image in Photoshop of about 100px by 100px. Any size will do, but I'll be using 100px by 100px. (File >> New)
  2. Create a new layer and fill it with the color of choice. I'm using #88c98e.
  3. Create a new layer for your initial design. Use any of the tools (Pen, Shape, Paintbrush, etc.) to create some sort of doodle drawing or basis for your pattern. Here's mine:
  4. Go to Filter >> Other >> Offset.
  5. Make the vertical and horizontal offset both 50px (half the height and width) and set the 'Undefined Areas' to Wrap Around. Click OK.
  6. Your image should spit into fourths and be at the corners with a small empty space in the middle, like this:
  7. Lastly, fill in the empty space as much as you like with more of the design to finish your seamless tile.

My final product:

Here it is repeating:

The Conclusion: When finished, set the image as a background image to any page and see how the tile flows seamlessly across the page. One very important note: When creating a tile with a different size starting canvas, be sure to set your vertical and horizontal offset to half the pixels in each perameter.