Have you ever seen that wonderful wood like texture or background found on many websites and wanted to know how it is done? This tutorial will teach you a basic but effective way to complete this desired outcome, which would work great as a background.

Step 1: Setting up the file.

Open Photoshop and create a new document with the size 500px by 500px. You can use any size you desire but for the sake of this tutorial we will stick to this size.
Create a new layer and using the Rectangle Tool cover the entire document with black (#000000).

Step 2: Creating the texture

Make sure your foreground colour is set to black and your background colour is set to white before completing the next step. You can also reset them to these colours by hitting “D” on your keyboard.

Now have your layer selected and click on “Filter” in the top menu bar. Then from the drop down menu hover over “Render” and then select “Fibers” from the next drop down menu.

After clicking on the Fibers link a new window will pop up allowing you to change the settings. Use the below settings:

After entering the above settings click on Ok to save your changes.

Your image will now look like this:

Step 3: Enhance and colour

Now we want to make everything look a lot better and add some colour.
Start by opening the blending options for your layer, this can be done like so:

Now with the blending window open, choose “Gradient Overlay” from the left hand side menu and enter these settings:

Click on Ok to save your changes.

Your image should now look like this:

Now all that is left to do is the colouring.
Make a new layer above your current layer. Change your foreground colour to brown (#42301b) and using the Rectangle Tool; fill the entire layer with the colour.

All we need to do now is set the layer style to “Color”

And you are all finished.
The final result should look like this:



In this tutorial I will show you how to create an unusual website layout inspired by nature. If you have the right photos you will need less than 30 minutes to complete this layout. This type of tutorial was requested by Grafpedia Members.

If you want to download this layout you need to apply for a VIP account. The cost is 9.95 $ and it will allow you to download all our VIP resources


Create a new document with the following size: 960 x 900 pixels. I will select Gradient Tool, and I will draw a vertical gradient with the following colors : #2c6ed5 on the top and #ffffff on the bottom.

I will download the following set of cloud brushes

Load the brushes in Photoshop, and on a new layer add some clouds over the layout.

Select Rounded Rectangle Tool and create a white shape in the middle of the layout

For this white shape add the following layer styles

I will add some stock images with nature elements.

After that I will add a stock image with a tree and some flowers

On the top of the layout I will add a image with a ladybug and a butterfly.

Now I will add a navigation bar on the top of the layout with Rounded Rectangle Tool

or this navigation bar I will add the following layer styles

This is my result

With Type Tool I will add the text

On the bottom of the layout I will create a shape. You can place there some images with your latest clients, or your latest work.

Over this white shape I will add some image spots. you can add here whatever you want.

On the left side and on the right side I will add a simple button. It will allow your users to browse through your latest work. I have used the same layer styles I have used for the navigation bar, and the arrow was made with a custom shape tool.

This is my final result.