APNG Creator

Uploads a sequence of PNG frames, lets you set each frame's display delay and the animation's loop count, then encodes a genuine Animated PNG file with the standard acTL/fcTL/fdAT chunk structure, using the browser's built-in CompressionStream for zlib-compressed scanlines. Nothing is uploaded to a server. A free online tool from Staaarter, right in your browser.

Runs locallyUpdated 2026-07-26

Overview

Introduction

This tool builds a genuine Animated PNG from a set of ordinary PNG images, entirely in your browser, so you can turn a sequence of frames into a single animated file without any server round-trip.

It's the encoding counterpart to this category's APNG frame extractor, letting you go from separate stills back to one animated file.

What Is APNG Creator?

An APNG encoder that takes a list of same-sized RGBA frames, each with its own display delay, plus a loop count, and writes a complete, spec-compliant APNG byte stream.

Every frame is compressed with the same zlib DEFLATE format regular PNG uses, via the browser's built-in CompressionStream API, so the output is a real file any APNG-aware viewer can decode.

How APNG Creator Works

For each frame you add, the tool decodes the uploaded file into raw RGBA pixels, then when you click Create APNG it writes an IHDR chunk (using the shared width/height), an acTL chunk announcing the frame count and loop count, and one fcTL control chunk per frame paired with that frame's compressed pixel data (as IDAT for the first frame, fdAT for the rest).

Each chunk's CRC-32 trailer is computed from its type and payload bytes, exactly as the PNG specification requires, so every chunk is independently verifiable by a strict decoder.

When To Use APNG Creator

Use it to turn a short image sequence (an export from an animation tool, a set of edited screenshots, or individually generated frames) into a single shareable animated file.

It's also useful for quickly prototyping how a multi-frame animation will look and time out before committing to a heavier video pipeline.

Features

Advantages

  • Produces a real, standards-compliant APNG file, not an approximation, verifiable with this category's own APNG Checker tool.
  • Runs entirely client-side; none of your frame images are ever uploaded anywhere.
  • Per-frame delay control lets you build animations with uneven timing, not just a single fixed frame rate.

Limitations

  • All frames must share identical dimensions; there's no support for partial-frame updates or per-frame canvas offsets (every frame fully replaces the previous one).
  • Very large frame counts or large canvas sizes take longer to encode since every frame's scanlines are individually compressed.

Examples

Simple two-frame blink animation

Input

Two 200x200 PNG frames, 500ms delay each, loop count 0

Output

A ~2-4 KB APNG file that alternates between the two frames forever

With loop count 0 the animation never stops, matching the classic infinite-loop GIF behavior.

Five-frame countdown, plays once

Input

Five 100x100 numbered frames, 1000ms delay each, loop count 1

Output

An APNG that counts through all five frames once and then holds on the last one

A loop count of 1 means the sequence plays exactly one full time before stopping.

Best Practices & Notes

Best Practices

  • Keep every frame's dimensions identical before uploading — mismatched sizes are rejected outright.
  • Preview the result with this category's APNG Player tool before publishing, to confirm the timing looks right.

Developer Notes

Chunk building, CRC-32 checksums, and zlib compression (via CompressionStream) all live in a pure async lib function operating on plain frame/delay objects; the component's only DOM-specific job is decoding uploaded files into pixel buffers and rendering the resulting bytes as a live <img> preview via a blob URL.

APNG Creator Use Cases

  • Turning a set of exported animation frames into one shareable APNG file
  • Building a simple looping status indicator or spinner as a real animated image
  • Reassembling frames after editing them individually with this category's other PNG tools

Common Mistakes

  • Uploading frames of different sizes and being surprised when the tool rejects them — resize them to match first.
  • Forgetting to click Create APNG after adjusting a frame's delay, since the encode step is a deliberate action, not automatic.

Tips

  • Use a short delay (under ~50ms) sparingly — some viewers clamp very fast frame rates.
  • Set loop count to 1 for a one-shot animation (like a reveal or transition) instead of an endlessly repeating loop.

References

Frequently Asked Questions