Emerald button

In this Photoshop tutorial we will make an emerald button for the site.

1) Create a new document 300 × 150 px with black background

2) Create a new layer. Take the tool , draw a rectangular selection and fill it with any color, for example, white.

3) Click on the button at the bottom of the layers palette and select the following styles there:


Gradient overlay:

Gradient colors: from 0a521d to 2ac553

You will get this result:

4) Now we will draw a frame. Create a new layer.

5) Again, use the selection to draw a rectangle, but a little more green. Place so that the edges are equally protruding from all sides.

6) Fill the selection with white.

7) Ctrl + click on the layer with the green button, a selection will appear.

8) Now go to the layer with the white rectangle and press DELETE. Now we have a frame, which remains only to add styles.

9) Add styles:

External glow


Gradient overlay:

Gradient colors: #598e67– #ffffff

Color Stroke # 5e6270

As a result:

10) Create a new layer for the highlight on the button.

11) Select the tool and draw a shape similar to this:

12) Right click on a layer in the layers palette – select the command Rasterize Layer (Rasterize layer).

13) Next in the menu Filter> Blur> Gaussian Blur (Filter – Blur – Gaussian Blur). Set a radius as you like, here 3.0 px

Here such a highlight appeared:

14) Finally, add some text to the button.


Easy and fast!

See you at www.https://photobecket.com!

Like this post? Please share to your friends: