Making transparent Gifs in Adobe PhotoShop

A transparent gif is a type of GIF image in which we set one or more colors as "transparent" or "invisible", if you like. So if the image is placed on a web page, the background color of the page shows in areas where the transparent color exists. To make an image transparent we first take a normal gif image, open it in a graphics editor such as Adobe Photoshop, select the colors that we want as transparent and save it.

In this article I'll provide the the directions to making a transparent gif from a normal gif image. We'll will be using Adobe PhotoShop (version 5.0). If you have a later version, the steps would be similar. Remember, that the instructions of making certain colors transparent has to be passed at the time of saving the image.

Making gifs transparent is quite a simple affair. Any color in a Gif can be made transparent.

1. Open a gif image
2. Choose File - Export - GIF89a Export
3. A dialog box opens. Pick the Dropper tool.
   
   
   
4. Select the color which you want as transparent from either the image or the color palette.
   
   
   
5. Click "OK" to save the image.

Here are the original and final versions of the image.

Original Image


Transparent Image

Two important points to remember when making transparent gifs

Before you move on, you must remember two important points when creating transparent gifs.
Firstly, the transparency of a color will be reflected throughout the image. You'll notice this in the above image where we have made white background transparent the teeth of the cartoon character that were also in white were made transparent.
Secondly, you can have transparency for more than one color by selecting them from the image or the palette. However, once the image is saved, there will be no differentiation between the various transparent pixels.