Transparent pixels can look different in PNG and GIF because the formats describe transparency differently. A PNG can preserve partially transparent pixels, such as a faint shadow or a softened edge. A GIF can designate a palette entry as transparent, so a pixel is either shown or skipped rather than partly blended. The export settings, background behind the image, and animation playback can introduce further differences. A checkerboard preview alone does not tell you which information survived.
The useful question is therefore more specific than “Does this format support transparency?” Ask whether you need a clean cutout, several levels of opacity, or a moving image whose frames must clear correctly. Those are different requirements, even when the same drawing appears in the editor.
A transparent background and a soft edge are different things
Imagine a small blue star with an empty background and a faint shadow. The empty area can be fully transparent. Around the star, however, several pixels might be only partly opaque. Those edge pixels let the blue blend gradually into whatever appears behind the star. The shadow may need an even lower opacity. Treating every one of those pixels as simply “transparent” hides an important distinction.
The W3C PNG specification describes alpha information separately from color. Depending on the PNG color type, transparency can be represented through an alpha channel or transparency information associated with other image data. You do not need to memorize every color type to make a good export decision: the practical capability to look for is retaining the opacity levels your drawing actually uses.
A hard-edged icon drawn with fully opaque squares may not use partial transparency at all. For that icon, the format difference may be invisible. A shadow, translucent highlight, or softened photographic cutout makes it much easier to notice. Compare the same edge at the same scale before deciding that one export is defective.
GIF transparency makes an on-or-off decision
The GIF89a transparency definition identifies a transparent color index. When that index occurs, the corresponding display pixel is not modified. This is different from storing an independent opacity value for every color pixel. The format can leave part of a frame unpainted, but it cannot reproduce the PNG star's whole range of translucent edge values in the same way.
An exporter must decide what to do with partly transparent input. It might make those pixels opaque, discard them below a threshold, or blend them against a selected matte before encoding. The exact decision belongs to the exporting tool. Do not infer a universal threshold from the file extension, and do not assume that a tool's transparency checkbox promises preservation of soft edges.
There is a separate color limit, too. GIF uses indexed color tables rather than an unrestricted collection of colors in each table. Losing a subtle blue shade and losing a subtle opacity level are related-looking problems with different causes. A jagged edge can involve transparency conversion; banding inside a fully opaque shape can involve palette reduction.
The background changes the edge you see
A partly transparent pixel is displayed in relation to the background behind it. An edge that looks natural on white can look pale on a dark chat window. If an exporter has already blended that edge into white, making the surrounding background transparent afterward does not recreate the original opacity information. The white contribution is now part of the visible edge color.
Use two contrasting backgrounds for a practical inspection. A light background can reveal a dark fringe; a dark background can reveal a pale halo. Add the actual destination color if you know it. The checkerboard remains useful for spotting empty regions, but its alternating squares can make a faint fringe harder to interpret.
For a deliberately crisp pixel drawing, consider whether the softened edge belongs in the design at all. An opaque one-pixel outline may communicate the shape more reliably than a photographic feather. That is a design option, not a rule that every pixel image must avoid alpha or that PNG should always be exported with hard edges.
Animation introduces another kind of leftover pixel
A moving GIF can leave trails even when its individual transparent areas look correct. GIF frames can update a region rather than repainting a complete independent scene. The decoder also follows disposal information that affects what remains for subsequent frames. A previous position may stay visible if the export and playback sequence do not clear or restore the intended area.
This is why opening one extracted frame is an incomplete animation check. Watch the downloaded file through its last-to-first transition as well as through the middle. A transparent background does not automatically mean “erase everything from the previous frame.” The GIF specification's frame-control rules explain that distinction; the actual result still depends on the encoded frames and the receiving viewer.
Also distinguish static PNG from animated PNG. PNG is not simply the “never animated” alternative to GIF: APNG adds animation behavior within the PNG format family. Your particular editor, messaging app, or display may accept only some of these outputs. Choose a destination-supported format rather than relying on an old comparison chart with a single animation checkmark.
Choose the export around the destination
The image-format guide's PNG and GIF sections provide a useful compatibility starting point. Keep the editable source, then export a copy appropriate to the job. A static overlay with a translucent shadow usually needs different properties from a short, hard-edged looping sticker. Neither filename alone guarantees that a receiving application preserves those properties.
If you are working in the Pixel Art Maker, its current export notes explicitly warn that GIF can reduce colors and change partial transparency. Save the editable project before experimenting. Export both versions from the same drawing, open the actual downloaded files, and compare them on the backgrounds where they will be used. That avoids comparing an editor preview with a transformed file.
If the intended destination is a physical desk display, browse pixel art speakers only after checking the target grid and current app import options. A model such as Divoom Ditoo-Pro provides a small pixel-art viewing context, but its product page does not establish that a transparent web GIF will retain every export property on the device. The receiving display is another background and another playback system to check.
Ditoo-Pro Retro Pixel Art Bluetooth Speaker Shop Divoom Ditoo-Pro retro pixel art Bluetooth speaker with 15W sound, vivid pixel display, DIY app control, alarm, white noise, and USB-C playback. ¥16,100 JPY Buy now
For a separate explanation of the working setup, the beginner pixel art workspace guide covers choosing a usable editor and keeping an editable copy. The file you share and the file you return to for edits serve different purposes.
When reporting a problem, include the source format, exported format, and the background where the difference appears. “The pale fringe appears only on black after GIF export” is more useful than “the transparency broke.” Keep an untouched source so that a later experiment with an opaque background does not become the only version left to edit.
FAQ
Does a transparent pixel have to be black underneath?
No. Color data and visible opacity are different properties. Fully transparent color values may be present in an image, but a normal composite hides them. Editing or conversion software can handle that hidden color differently, so inspect the visible result instead of using an eyedropper value alone to judge an edge.
Will enlarging the GIF repair a rough outline?
Enlarging changes how large the existing pixels appear; it does not restore the opacity values discarded during conversion. Return to the editable source to change the outline, matte, or export settings, then compare a new file at the intended viewing size.
Conclusion
Start by deciding whether your image needs empty space, partial opacity, or correctly cleared motion. Preserve the source project, export for that requirement, and inspect the downloaded result on both light and dark backgrounds. If only the GIF edge changes, investigate transparency and palette conversion before redrawing the artwork.
