中财网人力资源趋势:Vista Styled Button
来源：百度文库 编辑：中财网 时间：2024/04/29 03:50:22
Step 1
Like usual we are going to start off with filling the background with a radial gradient from a light grey to a darker grey. Light grey: #3e3d3d. Dark grey: #151515.
Step 2
Create a new layer (Layer > New > Layer) and using the rounded rectangle tool make a fixed shape of 300 by 50 pixels in the middle of the document.
Right click the shape and click make selection.
Select the gradient tool and set the style to reflected gradient. Set the foreground colour to #1c3f47 and the background colour to #2a6976. Left click in the middle of the selection and drag to the bottom of the selection and release. This will provide us with the base of the button.
Step 3
Now we are going to be adding some layer styles to our button to make it vista styled.
Layer > Layer Styles > Outer Glow
Layer > Layer Styles > Inner Glow
Layer > Layer Styles > Gradient Overlay
Now your button should be looking like this.
Step 4
Now we are going to be adding a reflection to our button. On a new layer select the area of your base layer (ctrl + click layer) and fill the selection with white (#ffffff).
With the rectangular marquee tool selected move it down below the button.
Go Edit > Transform > Perspective and drag the bottom right box towards the right while holding down the shift key (this pulls the other side out too so it keeps it even).
Add a layer mask and add a gradient from white to black within the reflection – this will fade it out.
Set the blend mode of the layer to Soft Light and lower the opacity to 15%.
Step 5
Last of all we are going to be adding some text. Choose a nice crisp and clean font for this.
