LegitTutorials.com

Step 1: New Document

Start by opening up a new document. 500×500 pixels should be plenty of room, set the background to white.

Step 2: New Layer

Create a new layer (ctrl+shift+n), and grab the rounded rectangle tool. On the top bar set the radius to 5 pixels, and have the tool set to fill pixels.

Step 3: Rounded Rectangle

Now create a rounded rectangle the size you want the content box to be. I made one roughly 200×200 pixels. The color does not matter as we will be applying gradient overlay anyway.

Step 4: Blending Options

Open up the blending options window for the rounded rectangle layer (Layer>Layer Style>Blending Options). Apply gradient overlay. Go from dark gray to a little bit lighter.

Step 5: Brushing

Create a new layer, set your foreground colors to white, and grab your brush tool. Select a soft brush roughly 75% the size of the box. Mine is 340 pixels. Now click once to apply the brush in the top left corner of the box. It should look like this.

Step 6: Contract

Get a selection of the rounded rectangle layer (ctrl+click on the layers pallet), Now go to select>modify>contract, and set the amount to 3 pixels.

Step 7: Delete

Select the inverse (select>inverse). Now delete this area of the corner brush layer. It should look like this.

Step 8: Soft Light

Deselect and the layer and set the layer mode to soft light.

Step 9: Shine Time

Alright now create a new layer, this time were gonna add a little shine to the top. With the same brush barley skim the top and click to apply it. Make a selection of the original box (ctrl+click), select inverse, and delete. It should look like this:

Step 10: Pen Tool

The box is starting to look pretty good now huh? Lets add a little more shine and sleekness. Grab the pen tool and set it to paths on the top bar.

Step 11: Paths

Create a new layer and create a path in the top right corner like I did.

Step 12: Gradient

Right click in side the selection and click “make selection”. Now grab the gradient tool and set it to white to transparent. Apply the gradient at a 90 degree angle from inside to out. It will look like this

Step 13: Opacity

Lower the opacity of this layer to 7%.

Step 14: Filp It

Now lets make a duplicate of this layer for the bottom right corner. Press ctrl+j to create a duplicate. Now go to edit>transform>flip horizontal and edit>transform>flip vertical. Put the duplicate in the bottom right corner.

Step 15: Text

Now the only thing let to do is add some text. For the heading i used helvetica 28pt with a 1pixel drop shadow. For the body I used arial, 14 pixels, in dark grey (#222222). The Divider is just 1 line black 1 white with the opacity lowered.