Recently Elegant Themes published a post about creating different styles that can be applied to the sign-up modules, my favourite was the bio sign-up where they have a photo of the person whose site it is sitting on top the sign-up.

I know a lot of people might not know how to remove the background from their images to replicate that style, so today I’m going to show you how simple it is to remove a background image from a photo.

You will probably find a lot more uses for this tutorial than just a sign-up module. just so you know this useful skill you are learning is known as deep etching.

Find an image you want to remove the background from and open it in photoshop, for this tutorial, I downloaded one from Pexels.

Now in photoshop on the right-hand side where it shows your layers, at the bottom, there are a bunch of icons at the bottom click on the square with a circle in it, when you click on it notice that your layer now has a white box next to the image? that white box is a layer mask which allows us to remove the background.

Next, we need to select the polygonal lasso tool, then we are going to zoom in so we can have a closer look at person enough so that we won’t be leaving any background on the sides of the person, so let’s start outlining the person in our image.

once you’ve outlined a bit of the background image press delete and it will delete that part of the background image. In the image above you will notice I only removed a small segment of the background, that because it always a good idea to do it in parts. So now you just basically need to repeat what we did previously until you’ve made you way around the person in your photo.

As you can see I’ve skipped a forward quite a bit I’ve finished going around her in my image. I’m sure depending on your image you’ve probably have had to trim a person strands of hair that sticks out a bit in random places? this is where you are going to have to take creative licence and do what you think will look best, otherwise, you going to spend a lot more time trying to get the image right.

Now all that left to do is delete the remaining background from the image and to crop it your desired size, so with the polygonal lasso tool draw a line between your person and the remaining background and then go along the outside of your image until you able to connect with your starting point and then hit delete, now you should have just your person left. I’ve added a background colour to my image so that you can see there no background left.

I hope that you find this tutorial useful, I personally love knowing how to do this to an image it helps a lot with clients websites.