Blog Banner

For a blog a banner is usually the only place where one will have some really creative graphical elements. I am going to show you how to create a very cool banner, and how easy it is to do it - with the right tools. Using a few textures, and a few little techniques you can make your boring blog header into something very cool! Blogging is more important to the users, but why not add some cool designs to your blog?

If you click on the image above it will take you to the full banner image you will be creating in this tutorial. I used some Photoshop Brushes in this tutorial, you can download them from a lot of sites. The best place to get nice ones are from Deviantart.com. Let's get started!

The Canvas

First of all you will need to create a new canvas the size will depend on your width of your site, or however wide you want it to be. Create a new layer and fill it in with a gradient. I used from #67930c to #7cb20e. Also open up the blending options and create an inner shadow with a very low opacity about 30%. This will make it 3d, more realistic, and thus more polished in the end

Blogging the pattern

Now we will need to create the pattern on the background. You can use any Photoshop Pattern you have or download some from the various sites out there. I got mine from Brusheezy.com from RubelCreative. Go to Layer>New Fill Layer>Pattern. A couple of windows will show up in one of them you will need to load up the pattern you want to use. To load up a new pattern is the same way to load up brushes. Put the new pattern layer to Multiply and with a opacity of 40%.

Borders

Now we can a bottom border. You can have this for your nav links, but in this case I didn’t. Make a new layer and use your rectangle marquee tool to make the selection. Fill it in with a greyish color. Copy that layer, and select the layer under it ( the original) and turn down the opacity and move it up. This will create the nice light top border on the bottom border.