: Add transparency to an existing PNG I'd like to use this image on a web site. What I need to do is change the background from black to transparent, so I can use the arrow on my site

@Shelley591

You can use Adobe Photoshop. Go to Select -> Color range. While holding down Shift, click on the color you need to remove (black in your case). Press ok. Then all your black will be selected; now hit delete.

Vote Up Vote Down

@Rivera951

Here's a useful technique I recently used for this - probably similar to "Color To Alpha" (Color To Alpha was greyed out, even though I was in RGB mode), but this method gave me some customization for how "soft" i wanted the edges to come out (as opposed to magic wand techniques which leave a thin black border around the image, rather than making the edges partially transparent).

Perhaps overly complicated, but in a nutshell I copied a grayscale version of the original image into it's Layer Mask/Alpha Channel, and then used Curves on the Alpha Channel to make most of the image opaque while adjusting how translucent the edges should be. Very nice effect and very customizable.

Here is a step-by-step to do that:


Starting with a layer with the original image on it called "image"
Duplicate the "image" layer to a new layer called "image alpha" (with the Duplicate Layer button in the Layers Dialog)
Colors > Desaturate... > Lightness on "image alpha" layer
Right-click the "image" layer and Add Alpha (if not already done)
Copy all of "image alpha" (in "image alpha" layer, Select All & Copy)
Paste it onto the Alpha channel of "image" (click on the right thumbnail
of the "image" layer and then paste it)


The previous steps are possibly identical to the single command "Color to Alpha"

Optional: right-click "image" and Show Layer Mask (should show you
what you pasted). If you omit this, you can see the transparency
change, live, during the next step.
Color > Curves
In the Curves dialog, make the curve flat along the top & then
rapidly declining to the left, causing most of the bright pixels to
become completely white (ie. the image is opaque there).
Uncheck Show Layer Mask to see the transparency applied.

Moving the Curves saturation point (at the top of the curves) and the speed with which it declines allows you to tweak just how much of the edges of the image are transparent and how much.

Vote Up Vote Down

@Eichhorn212

GIMP's Color to Alpha tool is very handy if you know how to use it, and this task seems particularly well suited for it:


Open the image in GIMP, and change it to RGB color mode if necessary.
Select Layer → Transparency → Color to Alpha...
Select black (#000000) as the color to make transparent.
Click "OK".
Save the resulting image in PNG format:

Vote Up Vote Down

@Karen819

You could use the GIMP's select by color tool or the Magic Wand tool. Anyhow you do it, just select all the black pixels. Then, instead of deleting the selected pixels, apply a layer mask:

Layer -> Mask -> Add layer mask


Select the "Selection" radio button and be sure to select the "Invert mask" checkbox. Now, all the black pixels are transparent.

Export as PNG or GIF.

The problem is in the edges around the arrow, where you might have some black pixels to form a matte. I don't know in GIMP but Photoshop has a nice feature to remove the previous matte and/or add a matte of your choice.

Vote Up Vote Down

@Gail6891361

I don't use gimp, but this image is a simple case where it should be straightforward to derive a decent transparency.

If you select the entire image, and then use that (or rather the greyscale version) as an alpha channel, you are pretty much done.

Depending on your software export features, you can just pick the alpha as the PNG transparency or you can use the alpha channel as a selection mask and delete the selection (bad) or use the slection as a layer mask (non-destructive), then export.

Vote Up Vote Down