Website Panel
Its difficult to describe what this is. I’ve called it a panel. Whatever you call it, its the sort of thing you would use in a website perhaps to contain your navigation controls.
Start off with a shape. Use your custom tool to create the shape below (The corners are at radius 20 px). Fill it with the color code: #D9D9D9. Rename the layer “base”
Add in the following properties to this layer’s layer style:
The Stroke color code is #949494
Create a new shape above the ‘base’ layer.
Add in all of the same layer style to this layer except for the drop shadow. Click on Gradient Overlay, check off ‘Reverse’ beside the gradient.
Add in a circle shape above the 2 layers. Use the same layer properties as the layer above, but make the gradient slightly darker and do not reverse the gradient.
You can add in a logo and arrow to the circle button to dress it up.
You can also add in layer styles to the second layer to make it look more realistic or to add more color to your graphic.
