Ever wondered how to make a tiled web page background where one tile joins perfectly with the next? This tutorial shows how to make a tiled web page background which has no visible tiling lines.

For this example of creating a web page background, I created this cloudy square. Any homogeneous texture can be used.
If you simply took this image, and used it as a web page background, you'd be able to see the nasty tiling lines it created, where one tile joined to the next.

Click Filter > Distort > Shear. Move both the dots all the way to the right (I've highlighted them with red arrows.) This moves the whole image to the right. Some of the clouds are pushed off the right hand side, and they reappear on the left hand side.

Now that our web page background image has been Sheared, the left and right edges will line up nicely, and the tiling line is now in the centre, where it can be easily worked on.

The same process needs to be repeated, but in an up-down manner. The Shear function only works left to right, so it will be necessary to rotate the web page background first (click Image, Rotate Canvas, 90º Clockwise). Now Shear the image again.
Now all the edges will line up perfectly. The next step is to remove the visible tiling lines.

Simply blurring the edges will not work here - the lines will still be apparent.
Select the Clone Stamp Tool, choose a blurry brush, and Hold Alt and
click somewhere. This will set the "origin" of the tool. Now use the
tool like
you would any other brush, and try to paint over the lines. The Clone
Brush tool doesn't paint any particular colour, it just duplicates
whatever is at the "origin". The origin follows the
brush - so as you paint upwards, the origin will move upwards too.
6 – The tiled wallpaper
This what that little piece of wallpaper looks when it's tiled. This technique can be done with a variety of images – paper, stones, grass etc.


More Tutorials:



