Photoshop has any number of filters, effects, and image adjustments which can be used for creative effects on images used in web projects. One very common effect is to have two versions of an image for use in rollover buttons. You may want to save your images in gif format so that the edges around the image can be transparent.

Here's our starting image.

By desaturating our image (in Photoshop - command shift - U), we have this result.

Rollover the Image Below

The rollover button effect was created using javascript. See the javascript section for the rollover button script.

An alternate version of this button using another Photoshop effect: gradient mapping. Under the Image menu, select Adjustments, Gradient Mapping.

Here is the alternate image.

The Resulting Button