Sleek Menu Bar

About Celoxdesign

Celoxdesign is a webdesign community offering free high quality tutorials in several categories such as Adobe Photoshop, Maxon Cinema 4D, Cascading stylesheets and xHTML.
I drive myself to give all my knowledge back to the design community for free and will continue doing this for a long time.

Guest tutorials

A new added feature on Celoxdesign is the guest tutorials section, this section will house tutorials written by my guests/members, some of them are even better tutorials that I've written over the past years. Register yourself and submit your own guest tutorials to give something back to the design community.

Step 5:

Make a new layer called Bar light. Take the brush tool , set the brush to soft brush with 40px size. Ctrl+Click the icon of the Menu bar layer in the layers pallette to make a selection of it. Now brush a stroke on your bar light layer. Make sure though that you have the top of the brush under the bottom of the selectio, this will give us a nice glow stroke. Maybe you don't get this the same as mine at ones, just try a couple of times and your golden. Now deselect the selection by pressing ctrl+D, take the movetool and press the upwards arrow key once. Change the opacity to 50%.

Step 6:

Set white as the foreground, take the gradient tool again with the same gradient as before (foreground to transparent gradient). Create a new layer called Shine, make a selection of the Menu bar layer, and make a gradient from the top of the selection to 3/4. Change the blendmode to Soft light.

Step 7:

Now take the pencil tool and set the brush to 1px, foreground set to white. New layer called White lines, and draw 2 lines around the menu bar like the below screenshot. You won't see the top white line yet because the background is white but we'll change the top background later on in this tutorial.

Step 8:

Repeat step 7 but use black as the foreground, draw the black lines around the white lines like below.

Step 9:

Make a similar selection to mine in the below screenshot.



Make a new layer called top BG and fill it with the selection still active with the following color: #48728b

< Previous123Next >Last >>