web 2.0 type Rounded Rectangular Button in Photoshop

In this tutorial we will learn how to make a web 2.0 type rounded rectangular button in photoshop.

1) Create a new file (File -> New) , and select a size (300 X 300 px) and transparent background.

2) Select “Rectangular Marquee Tool”

3) Now go to Select -> Modify -> Smooth ->  Set to 5 px
Now your selection will have rounded corner.

4) Now fill up the selection with any color you want using the “Paint Bucket Tool”.

 I’ve used dark blur color, and it looks liks this.

5) Right click on layer and select “Blending Options”, and do following settings.

6) Create New Layer (layer ->New Layer)..

Now Contract the selection by 2 pixel.

Select -> Modify -> Contract

7) Select “rentangular marquee tool” and  Click and hold “Alt” button and draw a shape like this.

8 ) Select “Gradient” tool from tool palette.

and select a color little lighter than previous color. I had select dark blue color, so now I will select little light blue color.

9) Hold and drag mouse from lower selection to upper selection.

10) Deselect the selection (ctrl + D) , and your button is ready.

 

 

Now you can add some text on the button.

---

You can leave a response below, or trackback from your own site.

---