PNG

PNG test files generated in your browser

Generate lossless PNG fixtures locally for transparency, exact pixels, dimensions, upload validation, and thumbnail tests.

Verified . Generated Blob signature, dimensions, transparency scenario, and exact byte size are inspected in the browser.

Identify PNG files

Magic signature
89 50 4E 47 0D 0A 1A 0A
Registered MIME
image/png

PNG stores typed chunks protected by CRC values; valid signature bytes alone do not prove that every chunk is intact.

Choosing PNG

PNG has broad support and preserves exact pixels and alpha transparency, usually at a larger size than modern lossy formats.

Use PNG for screenshots, interface graphics, and alpha handling.

Verify decoded color and transparency after optimization.

Common test cases

  • Lossless rendering checks
  • Transparency and alpha handling
  • Exact-size upload boundaries

Invalid and boundary cases

  • Truncated IDAT data
  • Valid PNG without alpha
  • Extreme dimensions or decompression cost

PNG fixture matrix

This format is generated locally in the browser and does not receive a permanent SEO URL.

Open the local generator

Generate and verify locally

These examples use the browser generator because this format has no permanent downloadable SEO URL. Generate the bytes locally, then validate the physical size and format signature before using the fixture in an upload, rendering, waveform, or conversion test.

Playwright

Generate a deterministic 64 KiB PNG fixture through the production UI, then assert both its physical byte length and signature. The test fails if the browser cannot encode the format, the download is missing, padding is inaccurate, or the bytes do not match PNG.

import { test, expect } from "@playwright/test";
import { readFile } from "node:fs/promises";

test("generate an exact PNG fixture", async ({ page }) => {
  await page.goto("https://testfiles.dev/#generator");
  await page.locator("#gType").selectOption("png");
  await page.locator("#gW").fill("64");
  await page.locator("#gH").fill("64");
  await page.locator("#gFill").selectOption("kb");
  await page.locator("#gSize").fill("64");
  await page.locator("#gName").fill("exact-64k.png");

  const download = page.waitForEvent("download");
  await page.locator("#gGo").click();
  const result = await download;
  const path = await result.path();
  if (!path) throw new Error("Browser did not expose the downloaded file");

  const bytes = await readFile(path);
  expect(bytes).toHaveLength(64 * 1024);
  expect([...bytes.subarray(0, 8)]).toEqual([0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a]);
});
Node.js

Validate a generated PNG before passing it to an upload or conversion pipeline. A matching extension or declared MIME is not accepted as proof; the command exits with an error when the signature is missing or disguised.

import { readFile } from "node:fs/promises";

const path = process.argv[2];
if (!path) throw new Error("Usage: node verify-png.mjs <fixture>");

const bytes = await readFile(path);
const expected = Buffer.from([0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a]);
if (!bytes.subarray(0, expected.length).equals(expected)) {
  throw new Error("Missing PNG signature");
}

console.log({ path, format: "PNG", byteSize: bytes.length });

Continue testing

Related formats

Copied