Photoshop Monday - Removing Backgrounds

This tutorial was created using Adobe Photoshop CS2. When most web designers and graphic artist first start out with Photoshop, they use eraser tool to manually remove the background from images. Not only is this tedious and time consuming, but you don’t always get favorable results. Here is one way to get very good and quick results using Photoshop’s extract tool.

1. Load up your photo. I grabbed the photo for this tutorial from Deviant Art .

Here is the original image that I’ll be using.

2. Filter->Extract… or Alt+Ctrl+X

3. Using the highligher tool, you’ll trace the edges of what you want to crop. I will typically zoom in to a comfortable level and use the Smart Highlighting feature. Stick with a brush size that is around 5 for well defined areas like hair and features, and a larger brush size like 15 or 20 for less defined areas. A useful tip is to remember that you have the eraser tool at your disposal, if you find that you have to highlight more than you need. This is useful for wisps of hair.

4. Once you’re done highlighting the area that you want to extract, use the fill tool to fill in what you want extracted. If you find that the OK button is grayed out, make sure that you complete the circuit with the highlighter tool.

5. Make changes using the eraser and the history brush tool, then save this image with a different filename, preferably as a .psd or .gif.

6. Image is now saved, with a transparent background.

7. Choose a background and paste this image onto a new layer.

8. Adjust the levels, add some added components, and you’re done!

This technique is perfect for making quick mockups. If you want much more meticulous results, then spend more time in the extraction phase, as well as the level adjustment phase.