Creating a professional looking web header
March 30, 2008
In this tutorial I am going to show you how to create this in the Gimp:
Click to view full size
- Create a new image with the dimensions 860px x 160px
- Set the active colours as forecolour: #175e95 and backcolour: #497da4
- Select the gradient tool and click and drag from the top to the bottom of the image
- Now create a new layer and select a region of width 860px and height 38px from the bottom and fill it with the colour white (#FFFFFF)
- Select the Layer menu and click Autocrop layer
- Change the opacity of the layer to 10.0, it should now look like this:
- Change the forecolour to #4278a2 and select the Gradient tool again(shortcut: “L”)
- In the blend options select the Gradient option and choose FG to transparent.
- Now click and drag from around 3/4 from the left to half way, this will create this effect:
- Now add some text to the bar at the bottom using font family: Arial and font size: 14px
- Add your logo near the top left using the Open as Layers option under the File menu, having done this you should finish up with the final result, something that looks like this:
Click to view full size
Lee W.
May 15th, 2008 at 3:31 pm
Thanks for the tip… I would have liked to see more detail in steps. I am a very new user of Gimp…