Rectangular Flat Button
We're going to draw a basic, rectangular button. Set the foreground color to a color of your choice, then draw a rectangle with the Rectangle Tool (u).
I told you it was basic! I've made mine more interesting by drawing another rectangle in a lighter color to give my button a thick border on its left-hand side, as shown at right.
You can also create basic, rectangular buttons with rounded corners using— you guessed it—the Rounded Rectangle Tool (u). Alter the "roundness" of your corners using the Radius field in the options bar, as shown here.
NOTE Photoshop Doesn't Replace CSS
On a web page, you'd probably use CSS instead of images to achieve this rectangular button effect. However, this technique is handy when it comes to drawing simple buttons for web comps in Photoshop.
Was this article helpful?