Super User is a question and answer site for computer enthusiasts and power users. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I got a web site design in PSD file from a web-designer. All element s there snap to guides, which is handy when I make a selection to copy an element of design to a PNG file: guides make my selection precise.

One button there has two states: normal and hover. Both states contains of several layers. So I am trying to copy both states as PNG files in order to make a nice button in html.

The problem is that both states have shadow effects, which go beyond the layers' edges, i.e. when I try to select a button my selection (snapped to guides) does not include an outer part of the shadow.

How do I make a precise selection of the button state in such situation?

share|improve this question

Here's a method I use to extract elements from PSDs:

1) Make sure only the layers of the button are visible. Hide all the others.
2) Make sure there is no background or any other unwanted color or semi-transparent pixels "hiding" or this will not work.
3) From the menu, select "Image" -> "Trim", and select all the checkboxes. Click "OK".

You should now have only the desired layers visible, including the effects (if they were visible).
Now you can use "Save for web & devices" to save the file.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.