Sleek and Spicy website header Tutorial - Web 2.0 Style

Category webmasters | Permalink | 24. February 2007

« Hitnews Web 2.0 Animated Logo Favicon.ico For Blog | American Idol Wallpapers »

select pattern

In this tutorial I am going to teach you how to make a nice sleek looking mockup for a website header.
It should look like this: Click here.

* We start by opening a new document (Ctrl+N) (Cmnd+N - Note for mac users - Replace the CTRL with Command) Dimensions 800px width X 120px Height - Background color set as white for now. OK
* On the background layer go choose black as your color and than go select the paint bucket tool- than click on your stage to fill the bg with black.
* Create a new layer above the bg(background) layer and name it “pattern”. While the pattern layer selected go select paint bucket tool and then go up to the top of the screen to the properties panel and select PATTERN instead of FOREGROUND.

select pattern

Select the thick pin stripes pattern.

select

In order to have the pin stripes pattern in your pattern library - you first must create one. Keep this document open and go open a new document (CTRL+N) and create something like this

Pattern
make sure you delete the background layer to be a transparent background. and not white. Than go to edit>Define pattern>give it a name “thickpin” and click ok.

You will now be able to close that doc. and go back to your oringinal document and select that pattern from the pattern library. You should have the paint bucket selected so just click the stage to fill it with the pattern.
Go select the pattern layer and double click it to open blending options. (if it doesnt open it for you than keep on clicking you will get it - make sure you are not clicking on the text - that wont work) - now select color overlay and choose a nice blueish color like I did #005777. and click OK. You should now see this: