40 Free Photoshop Buttons

May 20, 2012

In this free PSD file of websites buttons you will find a rainbow of free buttons. In the Photoshop file, they are all submit buttons; however, this PSD file is also a general websites buttons template file! All layers are non-destructive and all text is editable! All you need to do is find the button you want to use, enter in your text, and resize the background and BAM! You have your own custom button in seconds.

These free buttons were created with a range of color palettes and background colors in mind. No matter what the theme of the site is, one of these buttons will work seamlessly. Below you can find a full size preview of the web design buttons:

For those of you who are new to Photoshop, user interface design, and/or web design, I think you will find it helpful to examine the layer effects of the buttons. You will notice that different combination of roughly the same effects were used to create the web 2.0 look of the buttons, I encourage everyone to experiment and find what looks best for the site they are working on.

I would stress that the most important thing to remember when designing a button is that it presents itself to look like button — that way, there is no confusion for the users. This effect is mostly created with gradients, drop shadows and strokes. Studying the subtle effects of websites buttons around the internet is a great way to get accustom to common approaches (commonly known as patterns).

The fonts used in this buttons template are Museo and Helvetica.