How to Create Tiled Background in Photoshop

Creating a tiled line background for use on your website or print material is actually pretty simple. The steps are many, but super easy, and you'll end up with a professional looking tiled background at the end.

Instructions

Difficulty: Moderately Easy

Things You’ll Need:

• Photoshop
• 20 minutes
• Good colors

1. Start with a clean slate. Create a new image, about 100 pixels square with a transparent background in Photoshop.
2. Pick your your two colors and add them to your Swatch (under the color window) for easy retrieval.
3. Our dark swatch will be our main color. Select your line tool, make the width 20 pixels (or whatever width you'd like), click 'shift' and create a line extending beyond the edges of your canvas. Clicking 'shift' will let you create a perfectly straight line (in this case, perfectly 45 degrees).
4. Deselect the current line, and create a new line with your other color. This line should be 10 pixels wide (again, or however wide you'd like). Follow the same procedure for the previous line, then move it (using your keyboard arrows) until it sits exactly even with the edge of the dark line.
5. Link your two layers, copy them, and line up the new set. Do this a few times until the entire canvas is filled in.
6. Select your marquee tool, click 'shift', and select an area in the center of the image. Clicking 'shift' with the marquee will ensure you selected a perfect square.
7. Click 'Edit' -> 'Copy Merged', then create a new document about 150 pixels square with a transparent background and paste the copied section. Move the copied section to the lower left hand corner (not necessary, just makes things easier).
8. Duplicate the copied layer. Set the duplicated layer's blending options to 'multiply'. Now, using your keypad, nudge the new layer to the right until the lines match up exactly. Repeat the procedure, nudging the second new layer to the top.
9. What you will be left with is a square in the lower left hand corner that isn't darkened by overlap. This is your pattern. Make sure the original layer is selected, then click 'shift' and select only that area. Take care to not clip any of the area darkened by the duplicated layers.
10. Click on 'Edit' -> 'Define Pattern' and enter the name for your new pattern. Open a new document, maybe 250 pixels square and select the paint bucket tool. On the top menu, change 'Foreground' to 'Pattern' and select your freshly created pattern. Fill the new document to test. If all went well, you now have a perfectly created striped background!
11. Here's the quick cheat, now that you've read how to do this in Photoshop. A website called ColourLovers.com has the tools to create this kind of pattern right on their website. You can create a striped, tiled background with up to 5 colors right there and then, without needing to finagle with Photoshop's numerous steps.

Tips & Warnings

• Be very careful to ensure that your stripes line up exactly. Stripes that do not line up exactly will result in strangely mutilated tiled backgrounds.
• Use ColorLovours.com palettes to create an insta-tiled background without messing around with Photoshop.