With this nice & easy photoshop tutorial you can learn how to design some glossy, professional-style buttons.
1. Preparing the Canvas/Background
First of all create a new document of any size, or open up a website template document you might have laying around. I used small document size of around 400 x 340 because I’m not going to be making a complete template. I also added a light grey gradient into the background.
2. Create the Shape
Get the Rectangular Marquee Tool rectangular marquee tool icon and make a Set-Sized Selection of 140 x 140 pixels somewhere on the canvas.
3. Filling the Shape
With the selection still active, make sure you’re on a new layer and fill it with a radial gradient, using colors of your choice.
(I used #3e94d4 and #336fc1, I then also applied a White (#ffffff) 1px stroke to the main layer.)
4. Adding Highlights
Start by selecting the main layer again
Contract your selection by about 4-5 pixels by going to Select > Modify > Contract and inputting your amount in pixels.
Now, get out the Gradient Tool, then drag a White to Transparent gradient from the top to the bottom.
Now get out the Pen Tool and make an orb-shape path like the one shown below:
use the default options.
Create another new layer and again with the Gradient Tool make a White to Transparent gradient from the top to the bottom of your button, so you get something like this:
Change the layer mode for this layer to Soft Light then lower the opacity if needed(I didn't need to)
5. Finishing Touches/Details
For details I started by adding a low-opacity icon in the left corner of the button.
Then add some text so people know what the button is for.
I then duplicated all of the layers, moved them over so there’s about 10 pixels space between each of them then changed the gradient colors.To change the colors, simply edit the gradient for the first layer, then edit the drop shadow color for the text layer.
Credits:To Me and my friend who helped me.
You can download the PSD file here if you need a visual
Linear Mode
