# Fractals/png

PNG features:

• for png color depth can range from 1 to 64 bits per pixel
• All PNG images contain a single static image
• 1-, 2-, 4- and 8-bit palette support (like GIF)
• 1-, 2-, 4-, 8- and 16-bit grayscale support
• 8- and 16-bit-per-sample (that is, 24- and 48-bit) truecolor support
• full alpha transparency in 8- and 16-bit modes
• "palette-alpha" mode, effectively transforming normal RGB palette into RGBA
• gamma correction for cross-platform "brightness" control

# png file versions

PNGN = PNG N bit_per_color ( = nr_of_channels * bits_per_channel)

• PNG8 has 2^8 = 256 shades of gray or 256 indexed-color with 8-bit samples, usually means opaque or with GIF-like, binary transparency, but sometimes includes translucency[1]
• PNG16
• gray:
• Such images are typically used only in science, medicine, and the film industry
• It splits the color space evenly to ${\displaystyle 2^{16}=65\ 536}$  shades of grey[2]
• Note that it may be converted down to 8-bit for display, when display devices don't support 16 bits. Any values greater then 256 will simply be clipped to 255.[3]
• PNG24 has a color depth of 8 x 3 channels ( RGB) which is 24 bits per pixel color = ${\displaystyle (2^{8})^{3}=2^{8*3}=2^{24}=16\ 777\ 216}$  total colours and 2^8 = 256 shades of gray = Truecolor
• PNG32 has a color depth of 8 x 4 channels ( RGBA) which is 32 bits per pixel color = ${\displaystyle (2^{8})^{4}=2^{8*4}=2^{32}=4\ 294\ 967\ 296}$  colors = Truecolor and alpha
• PNG48
• RGBA: has a color depth of 12 x 4 channels ( RGBA) which is 48 bits per pixel color = ${\displaystyle (2^{12})^{4}=2^{12*4}=2^{48}=281\ 474\ 976\ 710\ 656}$  colors = Truecolor and alpha
• RGB:
• PNG64 has a color depth of 16 x 4 channels ( RGBA) which is 64 bits per pixel color = ${\displaystyle (2^{16})^{4}=2^{16*4}=2^{64}=18\ 446\ 744\ 073\ 709\ 551\ 616}$  colors

# Key words

• sample = intersection of a channel and a pixel in an image.
• sample depth = number of bits used to represent a sample value. In an indexed-colour PNG image, samples are stored in the palette and thus the sample depth is always 8 by definition of the palette. In other types of PNG image it is the same as the bit depth
• An tagged image is an image that is explicitly assigned a color profile, as defined by the image format. This is usually done by including an International Color Consortium (ICC) profile [ICC].[4]

# File format

• A PNG file starts with an 8-byte signature ( file header)
• After the header, comes a series of chunks

A chunk consists of four parts:

• length (4 bytes,[5] big-endian),
• chunk type/name (4 bytes[6])
• chunk data (length bytes)
• CRC (cyclic redundancy code/checksum; 4 bytes[5]). The CRC is a network-byte-order CRC-32 computed over the chunk type and chunk data, but not the length.
Length Chunk type Chunk data CRC
4 bytes 4 bytes Length bytes 4 bytes

The first eight bytes of a PNG file is an 8-byte signature[7] ( a magic signature) with the following (decimal) values"

```  DEC: 137 80 78 71 13 10 26 10
HEX:  89 50 4E 47 0D 0A 1A 0A
ASC:  NA  P  N  G \r \n NA \n
```
Values (hex) Purpose
`89` Has the high bit set to detect transmission systems that do not support 8-bit data and to reduce the chance that a text file is mistakenly interpreted as a PNG, or vice versa.
`50 4E 47` In ASCII, the letters PNG, allowing a person to identify the format easily if it is viewed in a text editor.
`0D 0A` A DOS-style line ending (CRLF) to detect DOS-Unix line ending conversion of the data.
`1A` A byte that stops display of the file under DOS when the command type has been used—the end-of-file character.
`0A` A Unix-style line ending (LF) to detect Unix-DOS line ending conversion.

## Critical chunks

• `IHDR` must be the first chunk; it contains (in this order) the image's
• width (4 bytes)
• height (4 bytes)
• bit depth (1 byte) Bit depth is a single-byte integer giving the number of bits per sample or per palette index (not per pixel). Valid values are 1, 2, 4, 8, and 16, although not all values are allowed for all colour types. See the table below[8]
• color type (1 byte, values 0, 2, 3, 4, or 6)
• compression method (1 byte, value 0)
• filter method (1 byte, value 0)
• interlace method (1 byte, values 0 "no interlace" or 1 "Adam7 interlace") (13 data bytes total).[9]
• `PLTE` contains the palette: a list of colors.
• `IDAT` contains the image, which may be split among multiple IDAT chunks. Such splitting increases filesize slightly, but makes it possible to generate a PNG in a streaming manner. The IDAT chunk contains the actual image data, which is the output stream of the compression algorithm.[10]
• `IEND` marks the image end; the data field of the IEND chunk has 0 bytes/is empty.[11]

PNG color types
Color
type
Name Binary Masks decimal value binary value
A C P
0 Grayscale 0 0 0 0 0 0002
2 Truecolor 0 0 1 0 color 2 0102
3 Indexed 0 0 1 1 color, palette 3 0112
4 Grayscale and alpha 0 1 0 0 alpha 4 1002
6 Truecolor and alpha 0 1 1 0 alpha, color 6 1102

Allowed combinations of colour type and bit depth[9]
Color type Channels Allowed bits per channel
1 2 4 8 16
Indexed 1 1 2 4 8
Grayscale 1 1 2 4 8 16
Grayscale and alpha 2 16 32
Truecolor 3 24 48
Truecolor and alpha 4 32 64

## Ancillary chunks

• `bKGD` gives the default background color. It is intended for use when there is no better choice available, such as in standalone image viewers (but not web browsers; see below for more details).
• `cHRM` gives the chromaticity coordinates of the display primaries and white point.
• `dSIG` is for storing digital signatures.[12]
• `eXIf` stores Exif metadata.[13]
• `gAMA` specifies gamma. The gAMA chunk contains only 4 bytes, and its value represents the gamma value multiplied by 100,000; for example, the gamma value 1/3.4 calculates to 29411.7647059 ((1/3.4)*(100,000)) and is converted to an integer (29412) for storage.[14]
• `hIST` can store the histogram, or total amount of each color in the image.
• `iCCP` is an ICC color profile[15]
• `iTXt` contains a keyword and UTF-8 text, with encodings for possible compression and translations marked with language tag. The Extensible Metadata Platform (XMP) uses this chunk with a keyword 'XML:com.adobe.xmp'
• `pHYs` holds the intended pixel size (or pixel aspect ratio); the pHYs contains "Pixels per unit, X axis" (4 bytes), "Pixels per unit, Y axis" (4 bytes), and "Unit specifier" (1 byte) for a total of 9 bytes.[16]
• `sBIT` (significant bits) indicates the color-accuracy of the source data; this chunk contains a total of between 1 and 5 bytes, depending on the color type.[17][18][19]
• `sPLT` suggests a palette to use if the full range of colors is unavailable.
• `sRGB` indicates that the standard sRGB color space is used; the sRGB chunk contains only 1 byte, which is used for "rendering intent" (4 values—0, 1, 2, and 3—are defined for rendering intent).[20]
• `sTER` stereo-image indicator chunk for stereoscopic images.[21]
• `tEXt` can store text that can be represented in ISO/IEC 8859-1, with one key-value pair for each chunk. The "key" must be between 1 and 79 characters long. Separator is a null character. The "value" can be any length, including zero up to the maximum permissible chunk size minus the length of the keyword and separator. Neither "key" nor "value" can contain null character. Leading or trailing spaces are also disallowed.
• `tIME` stores the time that the image was last changed.
• `tRNS` contains transparency information. For indexed images, it stores alpha channel values for one or more palette entries. For truecolor and grayscale images, it stores a single pixel value that is to be regarded as fully transparent.
• `zTXt` contains compressed text (and a compression method marker) with the same limits as `tEXt`.

Rendering intent values (Value Name Description)

• 0 = Perceptual for images preferring good adaptation to the output device gamut at the expense of colorimetric accuracy, such as photographs.
• 1 = Relative colorimetric for images requiring colour appearance matching (relative to the output device white point), such as logos.
• 2 = Saturation for images preferring preservation of saturation at the expense of hue and lightness, such as charts and graphs.
• 3 = Absolute colorimetric for images requiring preservation of absolute colorimetry, such as previews of images destined for a different output device (proofs).

# Examples

 89 50 4E 47 0D 0A 1A 0APNG signature IHDRImage header IDATImage data IENDImage end
Contents of a minimal PNG file representing one red pixel
Hex As characters

89 50 4E 47 0D 0A 1A 0A 00 00 00 0D 49 48 44 52
00 00 00 01 00 00 00 01 08 02 00 00 00 90 77 53
DE 00 00 00 10 49 44 41 54 08 D7 63 F8 CF C0 00
00 03 01 01 00 18 DD 8D B0 00 00 00 00 49 45 4E
44 AE 42 60 82

.PNG........IHDR
..............wS
.....IDAT..c....
.............IEN
D.B`.

IHDR Chunk
Offset into chunk Hex Value Decimal Value Text Meaning
0 0x0D 13 IHDR chunk has 13 bytes of content
4 0x49484452 IHDR Identifies a Header chunk
8 0x01 1 Image is 1 pixel wide
12 0x01 1 Image is 1 pixel high
16 0x08 8 8 bits per pixel (per channel)
17 0x02 2 Color type 2 (RGB/truecolor)
18 0x00 0 Compression method 0 (only accepted value)
19 0x00 0 Filter method 0 (only accepted value)
20 0x00 0 Not interlaced
21 0x907753DE CRC of chunk's type and content (but not length)
IDAT Chunk
Offset into chunk Hex Value Meaning
0 0x10 IDAT chunk has 16 bytes of content
4 0x49444154 Identifies a Data chunk
8 0x08 DEFLATE compression method using a 256-byte window[22]
9 0xD7 ZLIB FCHECK value, no dictionary used, maximum compression algorithm[22]
10 0x63F8CFC00000 A compressed DEFLATE block using the static Huffman code that decodes to 0x00 0xFF 0x00 0x00[23]
16 0x03010100 The ZLIB check value: the Adler32 checksum of the uncompressed data[22]
20 0x18DD8DB0 CRC of chunk's type and content (but not length)

Displayed in the fashion of hex editors, with on the left side byte values shown in hex format, and on the right side their equivalent characters from w:ISO-8859-1 with unrecognized and control characters replaced with periods. Additionally the PNG signature and individual chunks are marked with colors. Note they are easy to identify because of their human readable type names (in this example PNG, IHDR, IDAT, and IEND).

```  PNG Signature(8 bytes): 89 50 4E 47 0D 0A 1A 0A
=======Chunk start=======
IHDR Chunk:
IHDR chunk length(4 bytes): 00 00 00 0D
IHDR chunk type(Identifies chunk type to be IHDR): 49 48 44 52
Image width in pixels(variable 4): xx xx xx xx
Image height in pixels(variable 4): xx xx xx xx
Flags in the chunk(variable 5 bytes): xx xx xx xx xx
CRC checksum(variable 4 bytes): xx xx xx xx
=======Chunk end=======

```

```od -c test.png | head -4

```

Example output:

```0000000 211   P   N   G  \r  \n 032  \n  \0  \0  \0 004   C   g   B   I
0000020   P  \0     002   + 325 263 177  \0  \0  \0  \r   I   H   D   R
0000040  \0  \0  \0   `  \0  \0  \0   `  \b 006  \0  \0  \0 342 230   w
0000060   8  \0  \0  \0       c   H   R   M  \0  \0   z   %  \0  \0 200
```

Programs:

• pngcheck a command-line program by Greg Roelofs
```pngcheck -c *.png
pngcheck -cvt *.png
```

# code

### octave

Octave code that creates array ( memory image) and saves it to the file[24]

```# octave m-file based on the m-file by Chris King
# http://www.dhushara.com/DarkHeart/Viewers/source/siegel.m
# an MyImage here is a matrix for 24 bit (3 byte) colors

# constan values
nx = 480;
ny = 480;
MyImage = zeros(ny,nx,3); # 2D matrix filled with zeros
magc=0.65;
dSide=1/magc;
Zxmin = -dSide;
Zxmax = dSide;
Zymin = -dSide;
Zymax = dSide;

stepy = (Zymax - Zymin)/(ny - 1);
stepx = (Zxmax - Zxmin)/(nx - 1);

# computations
for iy = 1:ny
Zy = Zymax - iy*stepy; # invert y axis
for ix= 1:nx
Zx = Zxmin + ix*stepx;
if(Zy>0 && Zx>0)  # first quadrant should be in upper right position
MyImage(iy,ix,2)=255-MyImage(iy,ix,2);
endif;
end # for ix
waitbar(iy/ny);
end # for iy
#
image(MyImage); # display image
imwrite(MyImage,'s.png' ); # save image to the file
```

# Checking png files

```file p.png
```

# Editing png files

• hex editors:
• editing of pixel data in a hex editor is pretty much impossible because of of the compression algorithm[25]
• use an online crc calculator to calculate the checksum for the png
• use TS/JS[26]
• pngcheck

Hexdump

```hexdump --canonical p.png
```

To show the output of the PNG header as described by the official libpng spec[27]

• to process the PNG file in 8-byte chunks
• the PNG spec is documented in decimal, which is represented by %d according to the hexdump documentation
• make the output perfect by adding a blank space after each integer
```hexdump -n8 -e'8/1 "%d ""\n"' p.png
```

• Extract ICC profile from the file
• To remove an ICC profile
• To embed an ICC prolile

Extract ICC profile from the file:

```exiftool -icc_profile -b -w icc somefile.png
```

To remove an ICC profile

```pngcrush -rem iCCP foo.png result.png
```

# References

1. stackoverflow question : what-is-difference-between-png8-and-png24 ?
2. Bit-Depth by Michael Reichmann December 2, 2011
3. stackoverflow question: 16-bit-grayscale-png
4. csswg : css-color-4 terminology
5. a b Laphroaig, Manul (31 October 2017). PoC or GTFO. ISBN 9781593278984. Each chunk consists of four parts: Length, a Chunk Type, the Chunk Data, and a 32-bit CRC. The Length is a 32-bit unsigned integer indicating the size of only the Chunk Data field
6. Laphroaig, Manul (31 October 2017). - PoC or GTFO. ISBN 9781593278984. Chunk Type is a 32-bit FourCC code such as IHDR, IDAT, or IEND. `{{cite book}}`: Check `|url=` value (help)
7. Portable Network Graphics (PNG) Specification (Third Edition) W3C First Public Working Draft 25 October 2022
8. a b W3C 2003, 11.2.2 `IHDR` Image header
9. Thomas Kopp (17 April 2008). "PNG Digital Signatures: Extension Specification".
10. "Extensions to the PNG 1.2 Specification, version 1.5.0". ftp-osl.osuosl.org.
11. w3.org png specyfication iCCP
12. "PNG (Portable Network Graphics) Specification \ Version 1.0". w3.org. Retrieved 30 May 2022. 4.2.6. sBIT Significant bits, 13 bytes total - color type 2 and 3 totaled 6 bytes
13. "PNG News from 2006". Libpng.org.
14. a b c Deutsch, L. Peter; Gailly, Jean-Loup (May 1996). "rfc1950". datatracker.ietf.org. Retrieved 2021-08-18.
15. Deutsch, L. Peter (May 1996). "rfc1951". datatracker.ietf.org. Retrieved 2021-08-18.
16. Sigel disc in Matlab by Chris King
17. Hacking Image Files – With a Hex Editor psychocod3r April 15, 2019
18. Mathilde E. Sep 8, 2020 : Understanding and decoding PNGs With an example in TypeScript
19. How Hexdump works. Hexdump helps you investigate the contents of binary files. Learn how hexdump works. By Seth Kenlon (Team, Red Hat) August 12, 2019
20. PNG-ICC-tests