White to transparent

[J1mmy]

I have an image (attached), which I'd like to remove the white into a transparent background as it will be going onto another background that I want to show through the image. How can I achieve this?

[EXreaction]

Very easy with photoshop.

I can not remember the exact name of the tool, but you can select a color range with it (under select->color range?). Just use it to select the white and delete it.

[tony_j15]

Magic eraser and the background eraser will do the trick in photoshop

[OuTpaTienT]

To do this correctly, not only do you need to delete the white color but you also need to know what color background it will be placed over. You need to save the new image as a .GIF with transparency and set it's MATTE color to the intended background color.

[J1mmy]

I managed to do it, can't remember what tool I used though. I went into color range, but couldn't seem to 'delete' it. I might have used the magic wand tool and cut it onto a new layer with a transparent background via .GIF

It's quite an important skill... I've always found myself cutting away backgrounds etc with PS

[Ty44ler]

You can use the magic wand tool if and just mess with the tolerance until you get the area you'd like to cut away selected, then just hit delete! Save it as a .png to preserve the transparent background.

[EXreaction]

[-FMA]

To do this correctly, not only do you need to delete the white color but you also need to know what color background it will be placed over. You need to save the new image as a .GIF with transparency and set it's MATTE color to the intended background color.

Can I ask why? Would it just be more crisper? If you're overlaying it and it's completely transparent then how would that work better? I've never done it that way, but if it's worth doing then I'll be changing my ways.

[OuTpaTienT]

Can I ask why? Would it just be more crisper? If you're overlaying it and it's completely transparent then how would that work better? I've never done it that way, but if it's worth doing then I'll be changing my ways.

Look at these images, read the text I inserted into them, and hopefully that should explain it. If not, ask me to clarify.

[Ty44ler]

Look at these images, read the text I inserted into them, and hopefully that should explain it. If not, ask me to clarify.

I just learned something today...

[J1mmy]

Look at these images, read the text I inserted into them, and hopefully that should explain it. If not, ask me to clarify.

Hmm, I see. But are you using read because that pink background?

[OuTpaTienT]

Hmm, I see. But are you using read because that pink background?

Exactly. If I intended to place the image over a blue background I would use a matching blue matte color for the GIF. If I intended to put it over a black background then I would use a matte color of black for the GIF. And so on. Have the matte color exactly match the background for best results.

Or instead of using GIF with transparency you could also use PNG(-24) with transparency. With PNG(-24) no matte color is needed because those PNGs allow partial transparency (uses an alpha channel). That means the edges of the image can really fade out and let the background show through. The pixels in a GIF don't allow partial transparency, they are either a solid color or they are completely transparent. That is why GIF must use the matte color so it can simulate that same fade out effect. (If I remember correctly, PNG-8 is just like GIF and needs a matte color.)

So why isn't PNG-24 used over using GIF? Mainly because Internet Explorer never displayed PNGs with transparency correctly. I honestly don't know if the most current IE has finally fixed this or not. But for years and years and years when Mozilla then Firefox displayed all PNGs perfectly, IE displayed them incorrectly so it was best to avoid them if you wanted your page to be compatible with all browsers. Plus the same image stored in the two formats, PNG-24 and GIF, will be a larger file size as the PNG-24 (at least 85% of the time it will).