Photoshop 3D Stereo logo and website navigation tutorial

Hi~ I'm going to teach you to use a few simple gradients and layer styles to make cool 3D Web pages, and if you want to make your Web page stand out, you can't miss the series,

Let's get started.

Effect Chart:

Step 1

Create a 1000x750 pixel size file, double-click the background layer to change it to an editable layer, and open the Layer style > Color overlay with #47382e overlay.

Step 2

Open the ruler (View > Ruler), and add some guides in the following figure

Step 3

Create a rectangle with the rectangle tool and name the layer header.

Step 4

Set the foreground color to black, and select the Ellipse tool to create a shaded area larger than the white rectangle. Name the oval layer as shadow and place it under the header layer.

Then turn on the filter > convert smart filter, then filter > Fuzzy > Gaussian blur, radius of 10 pixels, and set the opacity to 60%, to get the following image effect:

Step 5

Select the header layer, double-click to open the layer style, select the gradient overlay, and follow the following figure parameter settings.

Step 6

Use the line tool to draw a bright red line, then draw another line in black (1 pixels), and then group the red and Black lines, and the groups are named Vdivider. Open Layer > Layer Mask > Reality all.

Using the radial gradient tool, from black to white, pull down from top to bottom to add a gradient effect to the group.

Step 7

Use the type tool to create the navigation bar (font white). Then group all the labels, named White Links. Copy the group, place it under the white Links group, and set the font color to black.

Then move it up and to the left in a 1 pixel size position. This is to make a 3D effect.

Step 8 Category:

• PS Getting Started Tutorial