Create a Transparent Image Background Using Pixlr

Create images with transparent backgrounds

Source

A designer without Photoshop

When my previous computer went to silicone heaven, I was faced with the challenge of buying new software. I'm a designer and have used Photoshop forever but it's so expensive, particularly when I'd just bought a new laptop.

So here was my challenge - could I work without Photoshop? Could I discover something free that I could use instead?

Well, that was over a year ago and I don't miss Photoshop at all.

Create transparent backgrounds easily and quickly

Use a free online service to create your graphics

I love this photograph. It's a stock image I purchased a couple of years ago and I've used it in several designs. But the problem is that it has a solid white background. How can I change that?

Not only can I do so free, without the need of any special computer programs, but it takes only a minute and is so easy to do.

By using pixlr (I use the Google Chrome app but it's available as a website too) anyone can achieve professional results.

Using Pixlr

Online or as an app

When I discovered this online app, I thought it was likely to be an inferior version of the professional programs I've used for the last twenty years.

'Maybe' I thought 'I can use it until my finances have recovered and I can buy proper professional gear again.' That hasn't been necessary.

So here's a demonstration showing you how to easily create a transparent background for your images - in mere minutes.

If you're in a hurry, click here to jump to the quick guide.

Here you see my image uploaded to pixlr.com

Source

Step 1

The wand tool

You can see in the image above that the sunflower is now outlined. This is because I have tapped on the white area with the wand tool.

The wand tool (also known as the 'magic wand') is the third button down on the left hand side of the toolbar - you can see that it is selected because of its paler colour.

Source

Step two

Invert

Click the 'edit' link on the top horizontal toolbar. You'll see the option to 'invert selection'.Choose this option.

Once you have done this, click 'edit' again. This time, select 'copy'.

Source

Step three

Open new image

Click 'file' at the top left of the horizontal toolbar and then 'new image'. You'll see a popup (as shown in the screenshot above) where all the details are already filled out.

All you must make sure to do is check the box alongside the word 'transparent'.

Source

Step four

Simply paste

The screenshot above shows you that a new canvas area has now opened. The grey and white background confirms that your new image will have a transparent background.

Remember that in the previous step we copied the selected area? (The selected area being the sunflower). Now, all we need to do is paste via the 'edit' link.

Source

Step five

The pasted image

You can see on the screenshot above that the sunflower is now pasted into the new image with the grey and white background indicating its transparency.

Now all we have to do is save the image.

Source

Save the image

Save and you're done

Either use the 'file' link, then 'save' or press control+s to save your image. When the dialogue box pops up (as pictured above) you can title your image.

Be sure to save the images as a png file.See the dropdown box above.

Now I can use my sunflower on any background I wish. Plain, textured, with or without copy - my image is suddenly far more adaptable and can be used in so many different ways.

See the image here on a grey background

Source

Quick guide

Below is a quick guide to creating your images with transparent backgrounds

Here are the six quick and easy steps for quick reference.

Source
  1. Upload your image to pixlr.com
  2. Click on the white background area with the wand tool
  3. Edit > invert selection.Edit > copy
  4. File > new image. Be sure to check the 'transparent' box
  5. Edit > paste
  6. File > save. Be sure to save your image as a png file

InDesign Cloud

Adobe InDesign CC | Free Trial Available
Adobe InDesign CC | Free Trial Available

If only this had been available years ago... This is cloud version of InDesign and has many advantages over merely purchasing the software. One important one is that you can pay for it on a monthly basis at a low fee. Save even more by paying annually. Truly brilliant.

 

InDesign

Recommended graphics program

I was delighted to learn that there was no need for me to buy Photoshop. Even though I've been using it for so many years, it's been easy to adapt to the free online app.

I searched long and hard though to find a free or less expensive substitute for InDesign. I used InDesign daily and I knew that it was a program I couldn't do without. It is the professional design tool.

The cost was prohibitive though but I found a wonderful solution - the cloud version.

See the column on the right to learn more.

At one time, these professional programs were only available at high cost - often it was the design studio owners who bore the cost to ensure that their designers had the latest up-to-date versions.

Now anyone can enjoy and benefit from these professional services.

© 2014 Jackie Jackson

More by this Author


22 comments

BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@CelebrateUSA - thanks so much.I'm so glad it helps.


CelebrateUSA profile image

CelebrateUSA 2 years ago from Chicago, Illinois

Outstanding. This item has been a problem for me and I though only InDesign could accomplish this. Five stars!


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

I have to admit that I'd been using Pixlr for a while before I figured it out :) Thanks sukkran.


sukkran trichy profile image

sukkran trichy 2 years ago from Trichy/Tamil Nadu

I am using pixlr but I don't know this trick. Thanks for your useful Tips.


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@LadyMermaid - don't worry, if my clunky brain can cope with it I know that yours can :)


Ladymermaid profile image

Ladymermaid 2 years ago from Canada

Sounds like a program that I could really make good use of. I need things easy as my old brain goes into clunker mode when it runs into new concepts. Thank you for the handy tutorial on backgrounds. Very helpful.


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@SheilaMilne - thanks for reading. I think you'll like pixlr.


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@SheGetsCreative - thanks so much for forwarding it - I appreciate it.


SheilaMilne profile image

SheilaMilne 2 years ago from Kent, UK

I have to admit I don't know Pixlr but I'll definitely investigate. I've been using GIMP but that's really over-complicated for my needs.


SheGetsCreative profile image

SheGetsCreative 2 years ago from Seattle, WA

Good job explaining Pixlr's tools. I've used it several times, but your instructions make it so easy to follow, so I'm forwarding to a friend who needs a bit of help in the graphics dept.


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@CherylsArt - I imagine that it works well on the iPad too. I can't say for certain because himself thinks that our iPad is 'his' - therefore I rarely get a chance to use it!


CherylsArt profile image

CherylsArt 2 years ago from West Virginia

@BritFlorida - that's a good point that it's online and can be used on any computer. Thanks.


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@BrianRS - Elements is a lovely program. I do like free though:) Thanks for dropping by!


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@CherylsArt - something I love about Pixlr is that it's online so I can use it on any computer. There's even a phone app. I rarely use the phone version as I seem to be chained to the laptop but it comes in very handy when I'm out and about.


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

@Brite-Ideas - thank you Barbara! I'm glad it's helpful.


BrianRS profile image

BrianRS 2 years ago from France

I use Photoshop Elements to do similar tricks, but of course you have to pay for that program. Brilliant that you can do something so useful with a free program.


CherylsArt profile image

CherylsArt 2 years ago from West Virginia

That is so cool. I do have the option of erasing the background in Paint Shop Pro, but it is so nice to know that other options are available too.


Brite-Ideas profile image

Brite-Ideas 2 years ago from Toronto, Canada

Jackie, wonderful! looks great here, and pinning this for future reference, thank you for this


BritFlorida profile image

BritFlorida 2 years ago from Fort Lauderdale Author

Hi @bead at home mom - thanks for dropping by and for your kind words. Pixlr is very easy to use. It looks a little daunting at first but you'll soon get used to it. If you have any questions, just ask!


bead at home mom profile image

bead at home mom 2 years ago

I have just heard about pixlr I think I just read about it in Time as one of the top 50 staff picks of websites. Great tutorial Jackie thx for your never ending giving of yourself and your knowledge. I know I will giving it a look have never had Photoshop now I see I can scratch it off my wishlist.


    Sign in or sign up and post using a HubPages Network account.

    0 of 8192 characters used
    Post Comment

    No HTML is allowed in comments, but URLs will be hyperlinked. Comments are not for promoting your articles or other sites.


    Click to Rate This Article
    working