adv banner
Photoshop  Home Photoshop Web Layout Restaurant Header
rss

Restaurant Header

Author: AbTuts.com More by this author


Step 1

I will start with new photoshop document size 600x300px. Under foreground color set #E8DEC6, take the Rounded Rectangle Tool, under radius set about 5px, and create a shape for header.

image 1

image 2

image 3

If necessary, you can add 45° pattern with smooth opacity.

image 4

Step 2

In left top corner, we will add a picture of some food on plate.

Find any adequate picture and cut it precisely using the Extract Filter (Filter > Extract).

image 5

Step 3

Now, we will add a name of restaurant and slogan on header.

I have used Calisto MT bold font with 3px stroke.

image 6

Step 4

Under foreground color set #BBAF89, press and hold down Ctrl key and click on shape layer to select it.

While the shape selection is still active, take the Rectangular Marquee Tool, and under Options choose Subtract from selection. See the picture below.

image 7

Step 5

Move the Marquee tool over selection from left side to the right, and at the end, leave one part selected. Look at the picture below!

image 8

Step 6

Create a new layer, fill the selection with #BBAF89, and add a smooth horizontal gradient and shadow.

image 9

Step 7

Under Foreground color set #AC9F75, and using the Rounded rectangle tool, create the selection like it is shown on the picture below.

image 10

Step 8

Add on new shape the following styles:

image 11

image 12

image 13

Now, Your header looks like this:

image 14

Step 9

Now, we will connect this two parts. Create a clutch by horizontal gradient, one dark and beneath it one light. After that, take the Pencil Tool and create a slot like it is shown on the picture below.

image 15

When you create the first clutch, duplicate it, and move it a little down. See the picture below.

image 16

Step 10

Now, we will add a links for menu.

Create a new layer, take the Rectangular Marquee tool, and create the selection 1px height like it is shown on the picture below.

image 17

Step 11

Fill the selection with #B5A984, and beneath that selection create another one, and fill it with #EDE4CE.

Our menu line now looks like this:

image 18

Step 12

Now it's time for link text, and icon.

I have chosen bottle shape, and for links font I have used Calisto MT bold, this color #450000.

image 19

Repeat this steps for all other links in menu.

Restaurant Header Tutorial: Final Result

We're done!



Author's URL: abtuts.com

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Restaurant Header"