This n That Graphics



graphicstutred.gif - 1397 Bytes

Create A Seamless Tile
Using Photoshop

There is nothing worse than a tiled background that shows the tile's seams. This tutorial will guide you on how to make a Seamless tile that you can use for a background. Please keep in mind that once tiled, your background should also be able to accept readable text.

You can create a seamless tile can be created by using the filters that are included with your Photoshop program. Below, you will find a step by step example of how to make your seamless tile.


  1. With Photoshop open, start a new image,
    1. (a) set the Width and Height to: 96 pixels:
      96 x 96.
    2. (b) set the Resolution to: 72 pixels.
    3. (c) set to Mode to: RGB.
    4. (d) set the Contents to: White.
 new96.gif
  1. Using your paint brush, draw lines on your new image. Note - you can vary the size of the brush.
 lines96.gif
  1. From your Photoshop menu choose:
    1. Select > All
    2. then choose: Filters > Distort > Ripple


    Setting should be:
    Amount: 400%
    Size: Medium
 distorrtset.gif
  1. With the entire image still select, from your Photoshop menu choose:
    1. Filters > Other > Offset >
    Setting should be:
    Horizontal: 48
    Vertical: 48
    Undefined Areas: Wrap Around

    Use your Clone Stamp Tool and/or Smudge Tools to clean up the image or to fill in the center and other bare areas. NOTE: Don't alter the image at the outer edges.
 offsetsm.gif

 Here is where your tile becomes seamless!
  1. With the entire image still select, from your Photoshop menu choose:
    1. Filters > Stylize > Emboss >


    Setting should be:
    Angle: -30 degrees
    Height: 2 pixels
    Amount: 50%
 embossedsettings.gif
  1. Now you are ready to add some color. Again, with the entire image selected from your Photoshop menu choose:
    1. Image > Adjust > Hue/Saturation >

    Experiment with setting to achieve your desired color.

    I choose the following color settings:
    Hue: 225
    Saturation: 47
    Lightness: - 31

    NOTE: Be sure that the 'Colorize' check box is marked.
 colorizesm.gif
  1. Save your Photoshop file, then export your seamless tile.

    Click on Tile for full page viewing.
 tileseamless.gif

  Page 1 of 1  
Page added on 02-26-2001
Site Map Home