Final Image Preview

Step 1

Let’s start out by creating a new file. I used a 1000×900 pixels canvas set at 72dpi, and I filled my background with #FFF1AE color shade. Then select the Horizontal Type Tool then set the font family to Arial Rounded MT Bold, bold, 48 pt, crisp and #BF7000 color shade. In a new text layer type your website name on the top left side of the canvas.

Step 2

Under Layer Style(Layer > Layer Style) add an Outer Glow, Inner Glow and Gradient Overlay blending options to your website name text layer.

Step 3

Next to your website name add your navigation links with its own icon next to it. Use font Arial, regular, 14 pt, none and #894000 color shade. You can grab the icon files here.

Step 4

Now add a search box next to your navigation links.

Step 5

Make a new layer set and name it 'Content Box', in a new layer draw a large white rectangle with 460 x 300 px dimensions below your website name. Then in a new layer draw a dark green rectangle with #051F14 color shade and 460 x 30 px dimensions.

Step 6

Under Layer Style(Layer > Layer Style) add an Inner Shadow blending option to your dark green rectangle layer.

Step 7

Now add your text such as a title, post details and content paragraph on the content box. Use font arial, regular, none and black color shade for the content paragraph, use white for the title and #00A855 color shade for the link.

Step 8

Add another content box design below the first.

Step 9

In a new layer draw a small white rectangle with 91 x 21 px dimensions on top of your content box. Then in a new text layer type 'Latest Blog' or the title of your content boxes using font Arial, bold, 12 pt, none and #E20000 color shade.

Step 10

On the top right side of your canvas add a section for your latest work. In a new layer draw a long white rectangle with 21 px height. Then in a new layer text type 'Latest Work'.

Step 11

In a new layer insert a sample image of one of your work with 520 x 237 px dimensions. Then under Layer Style(Layer > Layer Style) add an Outer Glow and Stroke blending options.

Step 12

Below your sample image add the details of the work such as website name, date, category etc. Use font Arial, regular, 12 pt, none and #D50000 color shade for the link color.

Step 13

Add as many sample work content below each other, 2 is good.

Step 14

Make a new layer set and name it 'Footer'. In a new layer draw a large brown rectangle with #371F03 color shade and 980 x 170 px dimensions below your content.

Step 15

On the right side of the footer add your copyright information using font Arial, regular 15 pt, none and white color shade. Use #FF0000 color shade for link color. Now add a cardboard box design next to the copyright info, grab the file here.

Step 16

Now add your main links on the left side of the footer.

Result: Personal Portfolio Template

 Download Personal Portfolio Template Psd file