When viewing an anti-aliased graphic with a transparent canvas color in a Web browser, sometimes an off-colored ring, or halo, of pixels appears around the borders of the graphic.
When you make the canvas color transparent, the pixels from the anti-aliasing remain. When you place the graphic on a Web page that has a background of a color other than the color to which it was anti-aliased, the perimeter pixels of the anti-aliased object may be apparent on the Web page's background. These form the halo, which is especially noticeable on a dark background.
For native Fireworks files or imported Photoshop files, you can prevent halos by making the canvas color match the Web page's background color.
You must remove the halo for GIF files missing the source file and for imported image files that are anti-aliased to an index color (usually a transparent canvas color). To remove the halo, make the lighter anti-alias colors in the halo transparent using the Optimize panel.
Optimize panel
Use Index Transparency and manually trim the halo colors using the Eyedropper buttons in the Optimize panel.
To remove the halo from a graphic:
1 | Click Preview, 2-Up, or 4-Up. In 2-Up or 4-Up, click a view other than the original. |
The Optimize panel displays Index Transparency in the transparency pop-up menu. | |
2 | Choose the Magnify tool and zoom in until you can distinguish the pixels surrounding the borders of the objects in the graphic. |
3 | In the Optimize panel, click the Add to Transparency button.
|
The pointer changes to an eyedropper. | |
4 | Click the off-color pixels that form the halo to make them transparent. |
![]() |