Select Page

Removing backgrounds from images


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.

2 Comments

  1. adriene
    • Facebook
    • Twitter
    • LinkedIn
    • Google+
    • Buffer
    • Pinterest
    • reddit
    • StumbleUpon

    Good video although it looks unnatural as a lot of details of the hair are left out!

    Reply
    • James Fosker
      • Facebook
      • Twitter
      • LinkedIn
      • Google+
      • Buffer
      • Pinterest
      • reddit
      • StumbleUpon

      I think it comes down to everyone choice, trying to get hair perfect can consume quite a bit of your time.

      Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Why use The Divi Framework.


Divi is a leading WordPress theme which powers almost 2 million websites around the world, Divi makes building a website super simple as it has one of the most powerful drag and drop builders for WordPress.

We've been using Divi since December 2013 to help speed up client projects, it has made our workflow 1000% times better and has saved us countless hour everyday.

Divi Stride is a Divi Third Party developer, we spend countless hours building tools and resources for the Divi Community.

We are the creators of Section Style Manager (the 5th Divi Plugin to be released), Divi Commerce & Tighten.

| 6 minutes

Pin It on Pinterest

Share This

Share this post with your friends!

No products in the cart.