Often times you’ll have an image, perhaps a logo, that you want to use on a website, and you’ll want that image to have a transparent background. Here’s how to make an image have a transparent background using a free drawing program called Paint.net (note this solution works on Windows only).
First, you’ll have to download and install Paint.net if you don’t already have it. It’s a good free program to have if you don’t already have Photoshop.
Next, you’ll need a plug-in curiously named the “Grim Color Reaper” (don’t ask me why it’s called that). Download it, unzip the file, and copy the .dll file to your desktop for now.
You install this plug-in simply by copying the .dll file into the “effects” directory where Paint.net was installed. In most computers, that directory is here: C:\Program Files\Paint.NET\Effects. If it’s not there, check out this link to help you install Paint.net plug-ins.
After it’s copied, re-start Paint.net and open the file that you want to make transparent. Here is an example of a photo that we want to make transparent so it will integrate with a dark background:
Now, in Paint.net, select Effects -> Color -> Grim Color Reaper. You’ll see a preview of the image, with the transparent parts with a grey checkerboard pattern. In this case, the default settings are wrong; the image is transparent and the background is opaque (that might be okay with your image though). If it is not correct, select “Secondary Color” in the “What Color?” pulldown. You might also need to play around with the “Color tolerance” and “Consider transparent..” sliders to get the desired results with your particular image or logo.
When you get the opaque areas that you want, save the file as a .png. The result of this particular example is here:
Now, maybe your logo looks fine at this point. If so, you’re done. But with this image and the background color of this website, it doesn’t look so good. What I really want is the image to be white with transparent background. So, I went back into Paint.net to use the Recolor tool. This “looks” for the secondary color and replaces it with the primary color. Using the Color Picker, I selected the reddish-brown secondary color, then set the primary color to white, then clicked on the Recolor icon on the toolbar. I set the brush width to 400 to recolor the whole image quickly. The result is below!
Done! OK, in this particular example, the result is somewhat of a ghostly negative, but you get the idea. This is really useful for logos and such. Let me know about your experiences or comments!