All Articles Photoshop
Creating Tiled Backgrounds in Photoshop CS5
Geoff Blake on Fri, February 11th | 2 comments
Photoshop offers up a few different ways to create tiled patterns. In this tutorial, we'll have a look at the simplest, most direct way to create a tiled image. These tiled images are perfect for back

Photoshop offers up a few different ways to create tiled patterns. In this tutorial, we'll have a look at the simplest, most direct way to create a tiled image. These tiled images are perfect for backgrounds, either for a website or for a print layout.

If you're intending on creating a tiled background for use on the web, just be sure to keep your file low resolution (72ppi) and in the RGB color space. If you're creating a tiled background for commercial print output, then be sure to set up your file as a 300ppi CMYK document. Okay, let's get started!

Here's how to create and apply a pattern...

Step 1

Open the file that you'd like to use as a pattern.

This file can be any sort of image you have -- a photo, a logo, a cartoon...even text will work. That said, keep in mind that smaller images typically work best. Sure you can tile a 5x7" photo, but a smaller image would be much more effective.

Step 2

Using the Rectangular Marquee tool, select the area of the image that you'd like to use as a pattern.

For example, you may only want the top portion of your image to be used as a pattern, or maybe a corner. Go ahead and select that area. Be sure that Feather is set to 0 on the Options bar. Alternatively, if you want to use the entire image, select everything by choosing Select > All.


Now we need to save the selection as a pattern.

Step 3

Choose Edit > Define Pattern.

Step 4

In the Pattern Name dialog box that appears, go ahead and give your new pattern a name, then click OK.


Great! Now that our pattern is defined, we can go and use it. What we'll do is create a new blank file and fill it with our new pattern.

Step 5

Create a new blank Photoshop document.

Once again, keep in mind where you want to use your pattern and set your document's resolution, color space, and dimensions accordingly.


Now we're ready to fill our file with our saved pattern.

Step 6

Choose Edit > Fill.

Step 7

From the Use pull-down menu at the top, choose Pattern.

Step 8

Next, from the Custom Pattern drop-down, choose the pattern that you just created; then click OK.


Your file is filled with your newly defined pattern. Nice! At this point, you may want to save the image out for use on the web or perhaps for a layout you're working on in InDesign. Either way, creating patterns is pretty fast 'n easy in Photoshop!

Want to learn more? Check out these Photoshop tips and tricks.

Comments (2)

You must be logged in to comment. Login Now

  • This is fantastic. Why can't all Photoshop tutorials be as clear and easy as this one. Thank you so much.
    • 8 years ago
    • By:
    Reply
  • Just had to sign up to thank you for this tutorial. Brilliant, clear and now I know exactly what I am doing :)
    • 6 years ago
    • By:
    Reply
Feedback
Course Advisor
Don't Know Where To Start?
Ask A Course Advisor
Ask Us!
Copy the link below and paste it into an email, forum, or Facebook to share this with your friends.
Make money when you share our links
Become a macProVideo.com Affiliate!
The current affiliate rate is: 50%
Classes Start Next Week!
Live 8-week Online Certification Classes for: