The RGB image. This picture has no alpha channel and is completely opaque. | |
This is an alpha channel. By itself, it identifies the relative intensities of the pixels. | |
This picture combines the RGB image with the alpha channel, forming an RGBA picture. The portions of the alpha channel are blended with the background. In this case, the background is a light blue color. | |
This is the same RGBA image on top of a checkerboard background. (The background patterns changes as you mouse-over it.) The color stripes blend into the checkerboard background based on the intensity of the alpha channel. | |
This RGBA image uses a boolean alpha channel. Any alpha value not "100%" is rendered as 0%. The stripes seen in the original RGB image are still present in this picture. However, the alpha channel has hidden parts of the stripes. |
Operation | Gimp | Adobe Photoshop |
---|---|---|
Background The default RGB color for a transparent background. |
By default, Gimp uses a black background. However, the default background contents depends on the Gimp version.
Gimp 2.6.9 and earlier: If the picture was opened as an RGB and a transparent layer was then added, the default background pattern will match the RGB image at the time the transparency was added. Gimp 2.6.10 and later: Saving a PNG displays a menu that includes an option to "Save background color". This option will set the hidden pixels to whatever background color is selected at the time of the save. This can result in solid color backgrounds that are neither black nor white. |
The default background color is white. |
Unchanged Loading an RGBA image and saving it without any additional alterations. |
The RGBA values remain unchanged. | Adobe may apply a color profile, causing all RGB values to change a little. However, the alpha channel and the hidden RGB values will effectively remain unaltered. |
Erasing Using an eraser tool to remove color will set the alpha channel values to 0%. If 'feathering' is used, then the area between the opaque and transparent portions of the image will be a gradient (value between 1% and 99%). |
With Gimp 2.6.9 and earlier, the RGB values remain unchanged. Only the alpha channel is altered.
With Gimp 2.6.10 and later, the RGB values are set to black. |
The RGB colors masked by the alpha channel will be set to white. |
Drawing Lines Drawing curves and lines onto an RGBA image. |
Only the visible RGB values are set. The masked RGB values will remain unchanged.
Without the alpha channel, smooth curves will still appear as smooth curves. If the edges blend into the background, then the alpha channel will follow the smooth curves. |
The visible RGB values are set. The masked RGB values will either remain unchanged or the selected area will be filled with black.
Without the alpha channel, lines will appear rough and jaggy. Adobe uses the alpha channel to smooth curves and blend edges into the background. |
Fills and Selected Areas Fills into selected regions in an RGBA image. |
Only the visible RGB values are set. The masked RGB values will remain unchanged. | The visible RGB values are set. However, transparent areas outside of the selected region will have altered RGB values that match the fill pattern. This usually appears as horizontal or vertical colors stretched from the last visible pixel color. If a filled pattern is used, then the pattern is repeated outside of the visible area. |
Selection Masks Graphic editors that support layers often permit using one layer as a mask for another layer. Portions outside of the mask are hidden by the alpha channel. |
Only the visible RGB values are set. The masked RGB values will remain unchanged. | The visible RGB values are set. The transparent areas outside of the selected mask contain the unmasked picture. |
Text Text characters can be typed onto a picture. |
Only the visible RGB values are set. The masked RGB values will remain unchanged. | The visible RGB values are set. The selected area containing the text is filled with the text color. The transparent bounding box containing the text will have the same RGB color as the text.
Specifically: Adobe fills a region containing the text with a color, and then uses the alpha channel to mask out non-text pixels. (Similar to how a stencil is used to paint a sign.) If the entire text is recolored, then the bounding box is filled with the new color. If a portion of the text is selected and recolored, then the bounding box is filled with black and each part of the text is filled with the appropriate text color. The text color is filled slightly larger than the actual text and the alpha channel is used to deselect the fine details in the visual portion. |
Rendering Layers Advanced graphic editors support drawing layers that are combined to form the final output. How they are combined may impact the hidden pixel content. |
Because the hidden RGB values are usually black, the layer order does not impact the hidden RGB values. The only way to determine the order of layers or drawing actions is to look for overlapped content. | Adobe appears to combine RGB values from transparent areas based on the layer ordering. Lower layers are added first and upper layers overwrite the transparency from lower layers. In computer graphics, this overwriting approach is called a "painter's algorithm" and permits identifying the layer ordering. Specifically: if the hidden pixel coloring matches a component in the picture, then that component is on an upper layer. And if hidden pixel coloring from one component overwrites the hidden pixel coloring from another component, then it shows the overwrite comes from the upper layer.
Adobe Photoshop permits using layers as masks for other layers. This can result in a partial merger of different hidden region content. |
Other Operations This is not a complete list of operations that common graphic editors perform. For example, most graphics programs can cut-and-paste selected regions, convert between bitmap and vector graphics, and perform skewing or scaling operations. |
In general, Gimp only alters the visible pixels. Hidden areas remain unaltered. Smooth curves that blend into the background will still appear as smooth curves. | In general, Adobe either bleeds colors into the transparent regions, or fills hidden regions with black or white. Curves that blend into the background rely on the alpha channel for shaping and smoothing; removing the alpha channel will reveal rough, jaggy edges. |
Software | Hidden Pixel Handling |
---|---|
Facebook and Instagram | Sets new content to black , but erasing on photos only changes the alpha channel and not the RGB values. For example, erasing corners from a photo for rounding pictures will retain the corner RGB values. |
Google Services includes Google Drawings (part of the online Google Docs service) and PicMonkey | Always erases all hidden pixels to black . |
ImageMagick | This program is commonly used to resize pictures, strip metadata, and convert image formats.
If the picture is altered, then all hidden pixels are converted to black . If the picture is unaltered, then there are no changes to the hidden pixel colors. |
Microsoft Office | All hidden pixels are colored gray (the color   is written #818181 or [129,129,129]). As with Adobe, text and edges without the alpha channel appear jaggy; the alpha channel provides smooth anti-aliasing. |
Paint.NET | Sets hidden pixels to white . The visible areas do not appear jaggy without the alpha channel.
It is very common for people to use Paint.NET when editing a PNG that was generated by another applications, or to resave a PNG without edits. When Paint.NET saves a PNG from another application, the unaltered hidden areas retain their RGB values. Paint.NET sets all new hidden pixels from edits to white, but unaltered hidden pixels are unchanged. |
Inkscape | Sets hidden pixels to white . In general, this appears similar to Paint.NET, except that edges appear jaggy without the alpha channel.
As with Paint.NET, Inkscape is commonly used to edit PNGs that were generated by other applications. Inkscape sets all new hidden pixels from edits to white, but unaltered hidden pixels are unchanged. |
Adobe Photoshop Mix | Adobe has a large product line that contains many similar names. "Adobe Photoshop" is the desktop application, while "Adobe Photoshop Mix" is for mobile devices. Adobe Photoshop Mix sets all hidden pixels to black . In general, the hidden pixel usage is indistinguishable from Google Services. |
Base Image: | |||
Hidden rows: |
| Along the bottom and right edges of the picture, the JPEG data stream only encodes luminance components for visible elements. If only 3 of the 16 columns on the right edge are used (green), then the stream encodes the chrominance, along with only the two left-most luminance tables. JPEG pads out to the 8x8 boundary (white). The right-most luminance tables (gray) are not stored since they have no visible components. |
Method | Description |
---|---|
Lossless Cropping | If a large picture is simply being cropped to a smaller size, then there is no reason to decode and re-encode the quantized data. Any grids outside of the cropped region can be dropped, and any partial grids are stored without any alteration. This operation is called a lossless crop because it does not require recomputing the lossy JPEG encoding.
With lossless cropping, expanding the image to the 8x8 boundary will reveal original pixels from the source image that were padded out to the 8x8 boundary. |
Digital Cameras | Nearly all digital cameras completely fill out the JPEG grid; there are usually no hidden pixels along the edges. This is done for two reasons. First, it maximizes the size of the picture being generated. (Camera manufacturers can then boast about the size of the image.) And second, there are no unnecessary computations and no wasted space.
A few digital cameras, including models by Huawei, Kodak, Nokia, and Sony HDR, can generate pictures that are not grid-aligned. This is typically done to match an exact aspect ratio. These cameras typically fill the remaining hidden pixels with content from the camera sensor that is not normally visible. Expanding the image to show the hidden padding will reveal additional original pixels from the camera's sensor. However, some cameras are atypical. For example, Android 5.x devices (e.g., the Samsung SM-N910P smartphone) fills the padding with a grayscale stretch. (It looks like "stretched colors", but it is grayscaled.) Android 4.2.x fills the padding with a random slice from the image (it appears to be an uninitialized, reused buffer), and the GoPro Hero4 pads with random data (an uninitialized buffer). |
Stretched Colors (Common Libraries) |
The JPEG Standard (section A.2.4) specifies extending the last visible pixel color through the padded area. This minimizes distortions along the visible edge during decoding.
For example, if the JPEG uses 8x8 grids and the image only fills out 3 columns in the right-most grid, then the remaining 5 columns will be padded with stripes that replicate the previous visible values. → This stretched pattern indicates a common JPEG encoding library, such as libjpeg, gd-jpeg, or the Intel JPEG Library (IJL). Gimp, Facebook, and most non-Adobe products use this encoding approach. Adobe products older than CS, such as Photoshop 7.0, also use this approach. |
Reversed Pattern (Adobe CS or later) |
Beginning with the CS product line, Adobe reverses the visible pattern, appearing as a "butterfly" or rapid zig-zag pattern.
This padding approach attempts to soften ringing distortions from replicated patterns.
→ If the initial colors are "123xxxxx" (where numbers represent specific colors and 'x' are pixels that needs padding), then it will be filled with "12332112" or "12332123". The pattern reverses itself and repeats. This reversing pattern indicates an Adobe product (CS or later). It is present even when Adobe saves using the JPEG Standard quantization tables. |
Steganography | While extremely rare (even among steganography users), some steganographic systems attempt to store data in these hidden pixel regions. This can result in random-looking patterns in the hidden padding. |
Encryption | Encryption is different from steganography. Steganography tries to avoid being detected. Encryption tries to prevent comprehension. These are independent concepts; you can have encryption without steganography, and steganography without encryption. Some encryption systems store data in the JPEG image. This can result in a picture that looks like random noise. While most of these applications use a standard JPEG library for encoding the picture (resulting in stretched padding), a few tools appear to use custom encoding libraries. We have seen a few libraries that pad using solid black, solid white, or faint gray. We have not yet identified these encryption tools. |
A sample banner image. The transparency permits the logo to blend into the dark blue background. | |
The alpha channel is the transparency mask. | |
This overlay view shows the RGB image with the alpha channel inverted: what was hidden is now visible, and what was visible is now muted (with a checkerboard background). This shows the pixels that were hidden by the alpha channel and how they blend with the visible image. | |
The image without the channel displays all of the RGB values without any hidden masking. |
Over on Reddit, a user posted a picture titled "Introducing, hurdlers without hurdles." The picture had been uploaded to Imgur, which strips out metadata. This means that the metadata does not identify the last program to edit the image.
The source picture is 500x333. This means that encoded image in the JPEG is 504x336 (since both 504 and 336 are multiples of 8). The width contains 4 pixels of hidden padding on the right, and 3 pixels of hidden padding along the bottom. | ||
This shows the hidden padding.
| ||
This ad image, originally from Walmart, has been significantly altered. Sites that point out "photoshop disasters" criticized this picture for having items digitally placed in the room. Some items, such as the plant, rug, and crib lack reflections on the floor -- they are more obvious than some of the other edits. (Variations of this picture are still used to sell items on Amazon.)
The picture is 500x500. This means the encoded image is 504x504; it contains 4 pixels of padding along the right and bottom edges. | ||
Although the edges only have 4 pixels of padding, there is a very visible reversed padding pattern. This is most apparent in the upper-right corner, next to the white lights. The unpadded portion of the 8x8 grid tapers downward, along the curve of the white light. However, the padded portion reverses the pattern and tapers upward. This reversed pattern creates a distinct "butterfly" or "zigzag" appearance.
Similarly, the bottom center appears to show a circular shape in the bluish background. This is because the visible pixels began to spread out and the reversed padding close it back -- forming a circle. The other areas of the padding also follow the reversed pattern. However, the muted colors do not have a distinct edge, so the reversed pattern is more difficult to see. The padding with a reversed pattern is very distinct to an Adobe CS product (CS, CS2, CS3, etc.) Although the metadata indicates that the picture was last saved with an Adobe product, it does not identify any additional information. The hidden padding corroborates the metadata findings. Moreover, the hidden padding identifies it as an Adobe CS product and not a pre-CS product. |