Transparency in computer graphics is possible in a number of file formats. The term "transparency" is used in various ways by different people, but at its simplest there is "full transparency" i.e. something that is completely invisible. Only part of a graphic should be fully transparent, or there would be nothing to see. More complex is "partial transparency" or "translucency" where the effect is achieved that a graphic is partially transparent in the same way as colored glass. Since ultimately a printed page or computer or television screen can only be one color at a point, partial transparency is always simulated at some level by mixing colors. There are many different ways to mix colors, so in some cases transparency is ambiguous. In addition, transparency is often an "extra" for a graphics format, and some graphics programs will ignore the transparency.
Raster file formats that support transparency include GIF, PNG, WebP, BMP, TIFF, TGA and JPEG 2000, through either a transparent color or an alpha channel. Most vector formats implicitly support transparency because they simply avoid putting any objects at a given point. This includes EPS and WMF. For vector graphics this may not strictly be seen as transparency, but it requires much of the same careful programming as transparency in raster formats. More complex vector formats may allow transparency combinations between the elements within the graphic, as well as that above. This includes SVG and PDF. A suitable raster graphics editor shows transparency by a special pattern, e.g. a checkerboard pattern.
Transparent pixels
One color entry in a single GIF or PNG image's palette can be defined as "transparent" rather than an actual color. This means that when the decoder encounters a pixel with this value, it is rendered in the background color of the part of the screen where the image is placed, also if this varies pixel-by-pixel as in the case of a background image. Applications include:
an image that is not rectangular can be filled to the required rectangle using transparent surroundings; the image can even have holes (e.g. be ring-shaped) in a run of text, a special symbol for which an image is used because it is not available in the character set, can be given a transparent background, resulting in a matching background. The transparent color should be chosen carefully, to avoid items that just happen to be the same color vanishing. Even this limited form of transparency has patchy implementation, though most popular web browsers are capable of displaying transparent GIF images. This support often does not extend to printing, especially to printing devices (such as PostScript) which do not include support for transparency in the device or driver. Outside the world of web browsers, support is fairly hit-or-miss for transparent GIF files.
Edge limitations of transparent pixels
The edges of characters and other images with transparent background should not have shades of gray: these are normally used for intermediate colors between the color of the letter/image and that of the background, typically shades of gray being intermediate between a black letter and a white background. However, with, for example, a red background the intermediate colors would be dark red. Gray edge pixels would give an ugly and unclear result. For a variable background color there are no suitable fixed intermediate colors.
Partial transparency by alpha channels
Some image formats, such as PNG and TIFF, also allow partial transparency through an alpha channel, which solves the edge limitation problem. Instead of each pixel either being transparent or not transparent, it can be set to 254 levels of partially transparent, allowing some of the background image to show through the foreground image. A major use of partial transparency is to produce "soft edges" in graphics so that they blend into their background. See also monochrome or with shades of gray and anti-aliasing. Partial transparency can also be used to make an image less prominent, such as a watermark or other logo; or to render something see-through, such as a ghostly apparition in a video game. Animating the alpha channel in an image-editing program can allow smooth transitions between different images. The process of combining a partially transparent color with its background ("compositing") is often ill-defined and the results may not be exactly the same in all cases. For example, where color correction is in use, should the colors be composited before or after color correction?
Transparency by clipping path An alternative approach to full transparency is to use a clipping path. A clipping path is simply a shape or outline, that is used in conjunction with the other graphics. Everything inside the path is visible, and everything outside the path is invisible. The path is inherently vector, but can potentially be used to mask both vector and bitmap data. The main usage of clipping paths is in PostScript files.
Compositing calculations While some transparency specifications are vague, others may give mathematical details of how two colors are to be composited. This gives a fairly simple example of how compositing calculations can work, can produce the expected results, and can also produce surprises. In this example, two grayscale colors are to be composited. Grayscale values are considered to be numbers between 0.0 (white) and 1.0 (black). To emphasize: this is only one possible rule for transparency. If working with transparency, check the rules in use for your situation. The color at a point, where color G1 and G2 are to be combined, is ( G1 + G2 ) / 2. Some consequences of this are:
Where the colors are equal, the result is the same color because ( G1 + G1 ) /2 = G1. Where one color (G1) is white (0.0), the result is G2 / 2. This will always be less than any nonzero value of G2, so the result is whiter than G2. (This is easily reversed for the case where G2 is white). Where one color (G1) is black (1.0), the result is ( G2 + 1 ) / 2. This will always be more than G2, so the result is blacker than G2. The formula is commutative since ( G1 + G2 ) / 2 = ( G2 + G1 ) / 2. This means it does not matter which order two graphics are mixed i.e. which of the two is on the top and which is on the bottom. The formula is not associative since ( ( G1 + G2 ) / 2 + G3 ) / 2 = G1 / 4 + G2 / 4 + G3 / 2 ( G1 + ( G2 + G3 ) / 2 ) / 2 = G1 / 2 + G2 / 4 + G3 / 4
… excerpt ends here. Continue reading the full article.
