www.nayuki.io Open in urlscan Pro
2604:180:2:dc3::ac64  Public Scan

Form analysis
0 forms found in the DOM

Text Content

PROJECT NAYUKI


NAVIGATION

 * Recent
 * Programming
 * Math
 * Random

 * About/Contact
 * GitHub

--------------------------------------------------------------------------------


PNG FILE CHUNK INSPECTOR



Portable Network Graphics is a ubiquitous file format for conveying still
images. It is used on the web and in various document systems, and it has a
decent level of lossless compression.

A PNG file is composed of an 8-byte signature header, followed by any number of
chunks that contain control data / metadata / image data. Each chunk contains
three standard fields – 4-byte length, 4-byte type code, 4-byte CRC – and
various internal fields that depend on the chunk type.

The JavaScript tool on this page reads a given PNG file and dissects it deeply,
showing the list of chunks and fields as well as any errors that violate the
format specification. This can be helpful in looking for hidden metadata (i.e.
stuff not in the visual picture), as well as in developing software that reads
or writes PNG files in a compliant manner.


PROGRAM

Use sample file: Normal - Good - One black pixelNormal - Good - One black pixel
- PalettedNormal - Good - Tiny RGB graySignature - Bad - EmptySignature - Bad -
Mismatch, truncatedSignature - Bad - MismatchSignature - Bad - TruncatedChunks -
Bad - EmptyChunk - Bad - Length - TruncatedChunk - Bad - Length - OverflowChunk
- Bad - Type - TruncatedChunk - Bad - Type - Wrong charactersChunk - Bad - Data
- TruncatedChunk - Bad - CRC - TruncatedChunk - Bad - CRC - MismatchbKGD - Good
- Sans palettebKGD - Good - With palettebKGD - Bad - Wrong lengthbKGD - Bad -
Wrong colorbKGD - Bad - Wrong indexcHRM - Good - Rec. 709cHRM - Good - Rec.
2020cHRM - Bad - Wrong lengthgAMA - Good - 0.45455gAMA - Good - 1.00000gAMA -
Bad - MisorderedhIST - GoodhIST - Bad - Wrong lengthIDAT - Good -
ProgressiveIDAT - Good - InterlacedIDAT - Good - MultipleIDAT - Good - Some
emptyIDAT - Bad - Non-consecutiveIDAT - Bad - zlib - Wrong header checksumIDAT -
Bad - zlib - Wrong Adler-32IDAT - Bad - zlib - Extra data afterIDAT - Bad -
DEFLATE - TruncatedIDAT - Bad - Image data - Too shortIDAT - Bad - Image data -
Too longIDAT - Bad - Progressive - Wrong filterIDAT - Bad - Interlaced - Wrong
filterIHDR - Bad - Wrong lengthIHDR - Bad - Wrong dimensionsIHDR - Bad - Wrong
bit depthIHDR - Bad - Wrong methodsiTXt - GoodiTXt - Bad - Wrong separatorsiTXt
- Bad - Wrong language tagsiTXt - Bad - Wrong UTF-8iTXt - Bad - Wrong
compression methodsiTXt - Bad - Wrong compressed dataoFFs - Good - Micrometre
unitoFFs - Good - Pixel unitoFFs - Bad - Wrong lengthoFFs - Bad - Wrong unitpHYs
- Good - 96 DPIpHYs - Good - Horizontal stretchpHYs - Bad - Wrong unitsBIT -
GoodsBIT - Bad - ZerosBIT - Bad - ExcesssPLT - GoodsPLT - Bad - Wrong namessPLT
- Bad - Duplicate namesPLT - Bad - Wrong bit depthsPLT - Bad - Wrong lengthsRGB
- GoodsRGB - Bad - Wrong lengthsRGB - Bad - DuplicatesRGB - Bad - MisorderedsTER
- GoodsTER - Bad - Wrong lengthtEXt - GoodtEXt - Bad - Wrong keywordstEXt - Bad
- Wrong texttIME - Good - Leap secondtIME - Good - Unix epochtIME - Bad - Wrong
lengthtIME - Bad - Wrong fieldstIME - Bad - Wrong daytIME - Bad - MisorderedtRNS
- Good - Sans palettetRNS - Good - With palettetRNS - Bad - Wrong colortRNS -
Bad - Wrong lengthzTXt - GoodzTXt - Bad - Wrong keywordszTXt - Bad - Wrong
compression methodszTXt - Bad - Wrong compressed data (download) Read local
file: Check IDATs: (CPU- and RAM-intensive)

Chunk summary:

Start offset Raw bytes Chunk outside Chunk inside Errors




NOTES

 * The PNG file format starts off with a magic signature, and is followed by any
   number of chunks all with a uniform syntax. This design is similar to other
   popular multimedia file formats, like: BMP, TIFF, WAV, AVI, general RIFF.
   It’s different from plain text file formats (examples like Netpbm
   surprisingly exist), XML’s hierarchical elements, a ZIP container of
   subfiles, PDF’s custom binary format, etc.

 * A PNG file can contain multiple IDAT chunks to hold the compressed image
   data. This is semantically equivalent to concatenating the data bytes of all
   IDAT chunks; it is not equivalent to having multiple (sub)images. Having
   multiple IDATs costs a bit more space in chunk headers and footers, and it
   serves no benefit to the decoder. The main reason to have multiple IDATs is
   if the encoder software wants to keep memory usage low and not need to buffer
   the entire IDAT, which is required just to know the final length of the chunk
   before starting to write the chunk. A far rarer reason for many IDATs is if
   the payload data after compression exceeds 2 GiB; in this case it is
   mandatory.

 * Although this tool goes quite deep into various values and fields in PNG
   files, it can’t be perfectly detailed. For example, outputting every DEFLATE
   symbol, every pixel value, or even every palette value, would be very verbose
   and probably not helpful. Also, there are some complex external data formats
   (not defined in the PNG standard) that I choose not to understand or decode,
   such as ICC profiles or Exif metadata. When this tool is insufficient for
   your needs, the only remaining solution is to examine the raw bytes of a
   file, and parse the chunks and fields yourself.

 * Although Animated PNG isn’t a ratified standard because it competes with MNG,
   this tool supports checking its 3 defined chunk types. All aspects of APNG
   chunks are checked except for decompressing pixels from fdAT.

 * If you choose to read a file from your local system, this web application
   handles all the calculations in your web browser and does not upload the
   image to the server. The source TypeScript code (file 0, file 1) and compiled
   JavaScript code are available for viewing.


COMPARED TO PNGCHECK

 * Not made by me, pngcheck is a similar command-line program that displays
   information about a PNG file’s chunks and checks for format errors. It’s
   implemented in C and has existed since year 1995, around when PNG was born.
   As far as I know, it’s the only publicly available and comprehensive PNG
   checker, so presumably many other developers over the decades have relied on
   it to check their own work. My program was released in 2021, a long time
   after them.

 * In terms of verbosity, pngcheck is about 5000 lines of C code (includes MNG
   and JNG chunk support, but excludes a decompressor), whereas my work is about
   2000 lines of TypeScript code (includes HTML GUI logic and a DEFLATE
   decompressor).

 * My program and pngcheck can correctly detect almost all common and serious
   file errors. pngcheck fails to detect some errors like bKGD overflow, tRNS
   overflow, tIME wrong day-of-month, sPLT duplicate name, iTXt wrong UTF-8,
   zTXt wrong compressed data.

 * The author(s) of pngcheck admit to fixing a number of buffer overrun bugs
   over the years, and acknowledge that more security vulnerabilities can still
   remain. I volunteered to read over the entire source code of pngcheck v3.0.3
   (released on 2021-04-25), and was pleased to find no critical logic errors or
   security vulnerabilities. By contrast, I was aware of buffer overruns and
   numeric overflows while writing my code, and I believe I have avoided all
   possible mistakes; furthermore my code runs in a JavaScript virtual machine
   which is inherently memory-safe.


MORE INFO

 * W3C: Portable Network Graphics (PNG) Specification (Second Edition) (year
   2003)
 * W3C: Portable Network Graphics (PNG) Specification (Second Edition) - Chunk
   specifications
 * PNG (Portable Network Graphics) Home Site: PNG Specification, version 1.2
   (year 1999)
 * Extensions to the PNG 1.2 Specification, Version 1.5.0 (year 2017)
 * Wikipedia: PNG
 * pngcheck Home Page (command-line program)
 * Jason Summers: TweakPNG (Windows GUI program)
 * Varun Ramesh: PNG Format Inspector (web application)
 * LodePNG: pngdetail (command-line program)
 * Chris Nokleberg’s brokensuite-20061204 (114 files)

Categories: Programming, Image processing, JavaScript / TypeScript
Last updated: 2023-04-12

--------------------------------------------------------------------------------


RELATED / BROWSE

 * PNG library
 * Dumb PNG output (Java)
 * Image unshredder by annealing
 * 國內 doesn’t mean domestic
 * Absolute and relative lens apertures

--------------------------------------------------------------------------------


SIDEBAR


RECENT

Poor feedback from readers Common mistakes when using the metric system Binary
array set Meanings of home equity Drinking distilled water (more)


RANDOM

BitTorrent bencode format tools So you want to be a day trader? Bad idea.
Windows timestamp accessor library (more)


RSS FEED

Subscribe for updates



--------------------------------------------------------------------------------



Feedback: Question/comment? Contact me

Copyright © 2024 Project Nayuki