Design a Sleek Content Box in Photoshop

3-10-08 Filed under Designing & Photoshop Tutorials

Step 1:
Let’s start out by creating a new file. I used a 700×400 pixels canvas set at 72dpi, and I filled my background with a white color. Now create a new layer and draw a #729300 color shade rectangle, size 320×150 px.

Step 2:
Under Layer Style(Layer > Layer Style) add a Gradient Overlay blending option to your green rectangle layer.

Step 3:
In a new layer draw a rectangle with 320 x 26 px dimensions and #5B7500 color shade on top of your first rectangle.

Step 4:
Under Layer Style(Layer > Layer Style) add a Drop Shadow, Inner Shadow and Gradient Overlay blending options to the darker green rectangle layer.

Step 5:
Select your Horizontal Type Tool and above your screen under the options palette set the font family to Verdana, bold, 11pt, none and #FFD800 color shade. In a new text layer type the name of your content box.

Step 6:
Now select the Rounded Rectangle Tool and above your screen under the options palette choose Fill Pixels, set the radius to 12 px and check anti-aliased. Create a new layer and draw a white rounded rectangle with 173×9 px dimensions.

Step 7:
Under Layer Style(Layer > Layer Style) add a Drop Shadow, Inner Shadow and Gradient Overlay blending options to your white rounded rectangle layer.

Step 8:
Select your Horizontal Type Tool and above your screen under the options palette set the font family to Arial, regular, 11pt, none and white color shade. In a new text layer type your content on the gradient box.

Step 9:
That’s it your done.

Pages: 1 2
Did you enjoy this design? We publish fresh tutorials
on a daily basis so why not Subscribe to our RSS Feed?

---

2 Responses to “Design a Sleek Content Box in Photoshop”

1. » Design a Sleek Content Box in Photoshop Says:
   March 10th, 2008 at 2:55 pm

   [...] Alleba Blog wrote an interesting post today onHere’s a quick excerpt In this photoshop tutorial you will create a green sleek content box perfect for gaming related websites. (more…) [...]

2. Design a Sleek Content Box in Photoshop Says:
   March 10th, 2008 at 3:17 pm

   [...] unknown wrote an interesting post today onHere’s a quick excerptIn this photoshop tutorial you will create a green sleek content box perfect for gaming related websites. (more…) [...]

Add a Comment

Name (required)

Mail (required)

Website