Solved

I need an icon with a transparent background

Posted on 2006-07-12
11
287 Views
Last Modified: 2010-04-06
I woild like to take my existing icon and make the background transparent or create and icon with same. How can I do this?
Thanks.

0
Comment
Question by:expertsexchangehunter
  • 4
  • 3
  • 2
  • +1
11 Comments
 
LVL 16

Expert Comment

by:BongSoo
ID: 17091310
Open the file with photoshop, select the background, delete it, save it out as a gif. (I can give you more detail if you like)

BongSoo
0
 

Author Comment

by:expertsexchangehunter
ID: 17091343
Does the file have to be a jpeg file?
0
 
LVL 16

Expert Comment

by:BongSoo
ID: 17091456
JPEG doesn't support transparency. I think it has to be a GIF file, although PNG might work too.

BongSoo
0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
LVL 38

Expert Comment

by:lherrou
ID: 17091537
BooSong is correct, the file type must be .gif or .png. If the background is already uniform in color, and that color is not used elsewhere in the image, you can simply open in Photoshop, select Save for Web, and then select gif as the file type to save. You'll see a color pallete of the colors in the image on the right side. Click on the background color and then click on the little checkboard icon below the pallete of colors to make that be the transparent color. If you don't have photoshop, post back and we can give you some suggestions of free software and how to get your job done.

Cheers,
LHerrou
0
 

Author Comment

by:expertsexchangehunter
ID: 17092061
I opened up the gif file and followed the directions from above and after saving and closing he file the background is still blue.
0
 

Author Comment

by:expertsexchangehunter
ID: 17092174
This means the icon background is still not transparent
0
 
LVL 38

Expert Comment

by:lherrou
ID: 17092351
Can you post a link to the file? You can use http://www.ee-stuff.com if you don't have hosting elsewhere.
0
 

Author Comment

by:expertsexchangehunter
ID: 17092501
file has been uploaded
0
 
LVL 38

Expert Comment

by:lherrou
ID: 17092607
It looks like the "blue" of your image background is not a single color... you'll need to mask it off using the mask tool and then fill it with a single color, then make that color transparent (or mask it off and erase the masked area so it is transparent).

0
 
LVL 18

Expert Comment

by:JoseParrot
ID: 17094670
Hi,

In the case of icons, the filetype ico is the choice.

A very good editor for icons is the ArtIcons. You can download a tryal at
http://www.aha-soft.com/articons/index.htm
Please note that 24-bit icons are displayed incorrectly in some systems and they should be converted to 256-color icons for proper displaying.

Jose
0
 
LVL 18

Accepted Solution

by:
JoseParrot earned 250 total points
ID: 17098859
Hi,

My understanding is that your image is not suitable for an automatic color selection to transform it in transparent.

Let me suggest instead to work firstly on the drawing, then make the background transparent.
By adopting the word FIGURE for what is your foreground image and BACKGROUND for what will be turned transparent, the procedure can be:

1. Open your file with ArtIcons (or other icon editor). Don't use the JPG as starting file to the project. If you have the original artwork, the better. If not, use the .ico or .bmp or .gif you have.
2. Zomm in until you see each pixel comfortably.
3. Turn each pixel of what you want as BACKGROUND to yellow (or another contrasting color regard blue). This colouring must be manual, as there are more than one tonality of blue, as stated by lherrou.
4. After your FIGURE is exactly as you want (you can edit the FIGURE too, of course)
5. Set, in the editor, the BACKGROUND color as transparent.

You can notice some green pixels around the FIGURE, if the antialiasing (combination of opacity and soft settings)feature is working. These colors are part of the FIGURE and part of the BACKGROUND. The result will be a soft contour for the image.
Now, a very important step of the project:

6. Save as .png if you want the icon adaptable for any desktop paper or any image you put the icon on. You can select .ico with the alpha channel set to the BACKGROUND, with the same result (ArtIcons has such feature). By "adaptable" I mean the intermediate colors will be now intermediate transparency levels. This is a feature not need if the FIGURES are geometric squares, but interesting if the FIGURE has curve bounds.
If the image is saved as .jpg, it will lost the transparency property, as stated by BongSoo. If the image is saved as .gif, the intermediate colors will be turned part of the FIGURE and, when applicated on contrasting colors to the intermediate ones, will occurr an undesirable effect of jigged contour.

Hope it helps!

Jose
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Imac (Gaphic Card 4GB, 32 RAM) and After effects? 4 90
Need graphics tool to create card game 2 148
Any free software for printscreens 7 96
How do I invert an image? 5 45
Keep your audience engaged and get the most out of your next presentation with these quick Prezi tips.
Many programs have tried to outwit PowerPoint in terms of technology and skill. These programs, however, still lack several characteristics that PowerPoint has possessed from the start. Here's why PowerPoint replacements won't entirely work for desi…
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…

790 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question