How to Export a Seamless Tile from Illustrator

Finished seamless tile from a hex pattern in Illustrator.

Make Hex and Brick Patterns Rectangular!

Illustrator is by far the easiest tool to create complex seamless patterns, but converting a hex or  brick pattern to a seamless rectangular tile can look complicated at first glance. Learn how to export a seamless tile from Illustrator. Make a hex or brick pattern rectangular with a simple trick on the Illustrator pattern swatch.

Besides the traditional grid pattern, Illustrator also offers hex and brick pattern options as well. These pattern options allow users to quickly offset objects within the pattern to create diagonal spacing and hide pattern edges. Everything is saved neatly under an Illustrator pattern swatch.

However, other Adobe programs can’t import a pattern swatch. Therefore, seamless patterns don’t directly transfer.

Step-by-Step Tutorial to Export a Seamless Tile from Illustrator Using Hex or Brick Patterns

Create the pattern in Illustrator as usual. Once settled on the design, name and save the pattern swatch. Now, the new pattern appears in the Swatches panel.

Step 1: Create the pattern and save it.
Step 1: Create the pattern and save it.

Next, scroll to a wide blank spot in the canvas—no need for an artboard yet, but one will go here soon!

Find that pattern swatch. Then, click and drag the pattern swatch into the open space. Illustrator deposits the artwork used in the pattern swatch into a group. While it’s active, the pattern swatch displays the highlighted edge of a clear rectangle. These become the edges to a seamless tile!

Step 2: Drag the pattern swatch onto the canvas.
Step 2: Drag the pattern swatch onto the canvas.

Switch to the Direct Selection Tool (A), and select that clear rectangle within the artwork.

Finally, switch to the Artboard Tool (Shift + O) and choose the “Fit to selected artwork” preset from the dropdown menu. Illustrator automatically crops the pattern’s artwork to the rectangle.

Step 3: Select the clear rectangle and create a new artboard sized to fit the selected art.
Step 3: Select the clear rectangle and create a new artboard sized to fit the selected art.

That’s it! Save the new artboard to export a seamless tile from Illustrator using hex and brick patterns.

End result of converting a hex pattern to a seamless tile.
End result of converting a hex pattern to a seamless tile.

Quick Uses for Seamless Tiles

Use the seamless tile to create repeating background images on the web, import designs for printing wrapping paper, and more.

I found this seamless tile convenient for determining start and end points of the artwork for a new animation. Matching the edges of rectangles was much easier to do when preparing the animation. It was also clear where I needed to drag my artwork for a seamless diagonal movement across a rectangular canvas. (Plus, I only needed to maintain one link, which makes maintenance easier and decreases file size.)

Ice cream seamless animation.