Aseprite to Sprite Sheet — Packed PNG with Tags Kept

Drop the .aseprite file and open Pack & Export: every frame is packed into atlas pages in a worker while you watch, identical frames are stored once, empty borders are trimmed with their offsets kept, and the tags and per-frame durations from the file travel into whichever data file your engine reads.

Drop the .aseprite file and open Pack & Export: the frames are packed into a PNG (trimmed, identical frames stored once) and written with the data file your engine reads. The Aseprite JSON target gives the layout of Aseprite's own File > Export Sprite Sheet: frames with duration, meta.frameTags and meta.slices, as hash or array, on one page, with frame keys 0, 1, … that Phaser's createFromAseprite expects. Godot, Unity, PixiJS and other targets carry the tags and timing in their own form.

Drop frame images, a GIF or an .aseprite file to pack

Open the empty Studio

Runs in your browser. Files are not uploaded.

Studio Pack & Export: CC0 ninja frames packed on one page and the list of all 18 export formats, each with its own Export button — The real Studio with a CC0 asset (OpenGameArt).

Exports to

Phaser 3 / 4Verified· Phaser 3.90 + 4.2
Aseprite JSONVerified· Phaser load.aseprite · PixiJS 8.21
Godot 4Verified· Godot 4.7.2
Unity 6Verified· Unity 6000.5.3f1
PixiJS 8Verified· PixiJS 8.21
.asepriteVerified· Aseprite 1.3.18
Spine / libGDXVerified· spine-canvas 4.2
Starling / Sparrow XMLVerified· Phaser 4.2
LÖVEVerified· LÖVE 11.5
DefoldBuilt· Defold bob.jar 1.13.1
GameMakerUNVERIFIED
CSS spritesVerified· Chromium
GIF / APNGDecoded· Pillow

What a sprite sheet with Aseprite JSON contains

A sprite sheet is one image with every frame on it plus a data file that says where each frame is. In Aseprite's JSON each frame entry has frame (the rectangle on the sheet), rotated, trimmed, spriteSourceSize (where the trimmed rectangle sits in the original canvas), sourceSize (the canvas) and duration in milliseconds. meta holds the image name, size and scale and, when requested, frameTags (name, from, to, direction) and slices.

Hash and array differ only in frames: the hash layout is an object keyed by frame name, the array layout a list whose entries carry a filename. Frame names come from Aseprite's filename format; Phaser's createFromAseprite expects the item filename to be just {frame}, so the keys are 0, 1, 2 …

Tags are from–to ranges over the frame list, so every tag must be one contiguous run. Nerulio keeps that true while packing: a frame used by two tags, or a tag whose frames are out of order, gets a second entry pointing at the same region, and the export note says how many entries were repeated.

spriteSourceSize: Position and size of the trimmed pixels inside the original frame.
sourceSize: The original frame (canvas) size before trimming.
frameTags: Aseprite's animations: name, first and last frame, direction, and a repeat count when one is set.
Alias: A frame whose visible pixels equal another frame's is stored once; both entries point at it.

Example: the JSON written for a trimmed frame and two tags

"0": { "frame": { "x": 0, "y": 0, "w": 18, "h": 29 }, "rotated": false, "trimmed": true,
       "spriteSourceSize": { "x": 7, "y": 3, "w": 18, "h": 29 },
       "sourceSize": { "w": 32, "h": 32 }, "duration": 125 }
"frameTags": [
  { "name": "idle",   "from": 0,  "to": 3,  "direction": "forward", "color": "#6acd5bff" },
  { "name": "attack", "from": 10, "to": 15, "direction": "forward", "color": "#fe5b59ff", "repeat": "1" } ]
"slices": [ { "name": "pivot", "color": "#0000ffff", "keys": [
  { "frame": 0, "bounds": { "x": 0, "y": 0, "w": 32, "h": 32 }, "pivot": { "x": 16, "y": 32 } } ] } ]

trim: 32 × 32 = 1024 px² → 18 × 29 = 522 px² stored (−49 %), drawn back at (7, 3)

An endless tag has no repeat; a tag that plays once has "repeat": "1". The pivot (16, 32) is the bottom centre of the 32 × 32 canvas, used when the file has no pivot slice. Keys are positions in this list, not in the original file.

What maps to what

In the .aseprite	In the Aseprite JSON	Note
Frame pixels (all visible layers)	A trimmed region on the PNG: `frame` + `spriteSourceSize`	Layers are composited; identical frames are stored once
Frame duration	`duration` in ms	Whole milliseconds
Tag	A `meta.frameTags` entry with `from`, `to`, `direction`	Shared or out-of-order frames get extra entries
Repeat	`repeat` as a string when finite	Absent for endless tags
Pivot slice (or the bottom centre)	A `pivot` slice in `meta.slices`, keyed where it changes	Bounds = the frame canvas
Hit / hurt boxes	One slice per type and slot, with an empty key where a box stops	Rectangles only
Layers	One entry in `meta.layers` (`Layer 1`)	The sheet holds composited frames
Pages	Exactly one PNG	This target re-packs onto one page

What it does

Packers: MaxRects with five placement rules, Skyline and Guillotine; "try all" keeps the smallest page, and the same input always gives the same bytes.
Trim keeps each frame's size and offset; crop-keep makes frames smaller and moves the pivot so the art stays put; alias stores frames with identical visible pixels once, after a byte check.
Pages: multipack up to 64, a limit from 8 to 16384 px, power-of-two, square or fixed sizes, border and shape padding, extrude.
Scale variants from @0.5x to @4x, nearest-neighbour only, each its own atlas file; integer upscales are exact pixel copies.
Aseprite JSON (hash or array) in the layout of Aseprite's own File › Export Sprite Sheet: frameTags with direction and repeat, a duration per frame, and slices for the pivot and boxes.

How to do it

Drop the .aseprite file; the Sprite workspace reads its layers, tags and durations.
Open Pack & Export; the sheet is packed live and redrawn after each change (Cancel stops a long pack).
Choose your engine's preset or Aseprite JSON; a target that needs a single page or no rotation re-packs and says what changed next to its button.
Check the Packed frames list for frames that were trimmed or stored once.
Press Export for <target> and unzip the PNG pages and their data file into your project.

Files you get

File	What it is for
`hero.png`	The packed sheet: one page for this target.
`hero.json`	Aseprite JSON, hash or array, with `frameTags` and `slices`.
`README-ASEPRITE-JSON.md`	The Phaser loading code for these files and what PixiJS reads from them.

Load it in Phaser 3 or 4

Copy hero.png and hero.json into your game's assets folder.
In preload(): this.load.aseprite('hero', 'hero.png', 'hero.json').
In create(): this.anims.createFromAseprite('hero') creates one animation per tag, named after the tag.
Add and play: this.add.sprite(100, 100, 'hero').play('walk'). For pixel art, create the game with pixelArt: true.

For Godot, Unity or PixiJS choose their own target instead of Aseprite JSON: see Aseprite to Godot, Aseprite to Unity and Aseprite JSON to PixiJS.

Check the result

The number of entries in frames equals the frame count plus the repeated entries the export note mentions.
Play each tag in the game and time one cycle against Aseprite (walk: 6 × 100 ms = 0.6 s).
Open hero.png: trimmed frames sit tightly packed, so the sheet is smaller than a grid export of the same frames.

Sheet outputs from one .aseprite file

Output	Data file	Tags and timing	Checked with
Aseprite JSON (hash or array)	<name>.json with meta.frameTags and meta.slices	from..to ranges with direction and repeat; ms per frame	Phaser 3.90 and 4.2 load.aseprite; PixiJS 8.21 frames
Phaser 3 / 4	atlas JSON hash or multiatlas + .anims.json	one animation per tag, each frame's own duration	Phaser 3.90 and 4.2
PixiJS 8	spritesheet JSON with animations and anchor	playback order in animations; ms in meta.nerulio	PixiJS 8.21
Godot 4	SpriteFrames .tres + AnimatedSprite2D .tscn	speed per tag, relative durations, loop	Godot 4.7.2
Generic JSON	TexturePacker-style frames, animationData, pivots, boxes	kept in its own animation fields	read as a TexturePacker hash by Phaser 3.90/4.2 and PixiJS 8.21
Spine / libGDX atlas	.atlas text	none: an atlas lists regions only	spine-canvas 4.2 draws every region

Troubleshooting

Symptom	Likely cause	How to check	Fix
“Aseprite JSON describes one sheet image” error	The frames do not fit on one page at the current page limit	The page size setting in Pack & Export	Raise the page limit, or use the Phaser preset (multiatlas) or PixiJS 8 (linked pages)
Phaser creates no animations	The JSON has no `frameTags`, or its keys are not plain frame numbers	Look at the first key in `frames` and for `meta.frameTags`	Use Nerulio's Aseprite JSON; from Aseprite itself, set Item Filename to `{frame}` and tick Tags in the Meta options
Frames jump in your own loader	It ignores `spriteSourceSize`, so trimmed frames lose their offset	Compare a trimmed frame's position with `spriteSourceSize`	Draw each frame at `spriteSourceSize.x/y` inside `sourceSize`, or turn trim off
A reader shows frames sideways	Rotation was allowed while packing; Aseprite itself never writes rotated frames	`"rotated": true` in `frames`	Turn rotation off for this export
Pixel art is blurry in the game	The engine filters the texture linearly	Zoom in on an edge	Phaser: `pixelArt: true` in the game config; other engines: nearest filtering

Other ways to do it

Option	When it is the better choice
Aseprite's File > Export Sprite Sheet, or `aseprite -b hero.aseprite --sheet hero.png --data hero.json --format json-array --list-tags --list-slices`	You have Aseprite and want its own layout options; `--sheet-type packed` packs and `--trim` trims.
An engine target instead of Aseprite JSON	The engine does not build animations from Aseprite JSON (PixiJS, Godot, Unity): see which target keeps what.

Engine exports and how each was checked

"Verified" means the exported files were loaded by the real engine or tool on real CC0 assets and the result was compared with the source. Anything that was not loaded is labelled as such.

Target	Files	Check
Godot 4	`.tres SpriteFrames · .tscn AnimatedSprite2D · .png.import`	Verified Godot 4.7.2Loaded by Godot; every animation frame drawn and compared with the source file. The scene uses Nearest filtering; rotation is never used.
Unity 6	`.unity.json · Editor/NerulioSpriteImporter.cs · AnimationClip`	Verified Unity 6000.5.3f1Batch mode: sprite rects, pivots, pixels, clip keys and durations checked.
Phaser 3 / 4	`atlas JSON (multiatlas) · .anims.json`	Verified Phaser 3.90 + 4.2Frames and animations drawn by both versions.
PixiJS 8	`spritesheet JSON · animations · anchor · meta.scale`	Verified PixiJS 8.21Rotated and multi-page atlases included.
Aseprite JSON	`hash / array · frameTags · slices`	Verified Phaser load.aseprite · PixiJS 8.21Tags keep their direction and repeat count.
.aseprite	`layers · tags · durations · slices`	Verified Aseprite 1.3.18Opened and rendered by the Aseprite command line.
Spine / libGDX	`.atlas`	Verified spine-canvas 4.2Every region drawn by the Spine runtime, rotated and trimmed; libGDX itself was not run.
Starling / Sparrow XML	`XML per page`	Verified Phaser 4.2Phaser 3.90 draws trimmed XML frames wrongly (its own bug); the "Sparrow XML (Phaser 3)" preset turns trim off and passes in 3.90 and 4.2.
LÖVE	`Lua quads · nerulio_atlas.lua · main.lua`	Verified LÖVE 11.5Every frame drawn and every animation stepped through the shipped helper.
Defold	`.atlas · .tilesource`	Built Defold bob.jar 1.13.1Built by Defold's command-line builder; the built texture's UVs were read back.
GameMaker	`spr_<name>_stripN.png · gamemaker.json`	UNVERIFIEDNot loaded in GameMaker (no headless GameMaker). The strips are cut the way its strip importer cuts them.
CSS sprites	`.css · preview .html`	Verified ChromiumEvery class drawn from the shipped stylesheet.
GIF / APNG	`one file per animation`	Decoded PillowEvery frame and delay decoded again after export; APNG is exact.

Evidence

Exports: 49 runs in the real engines on real CC0 assets, 47 pass — the 2 failures are Phaser 3.90's trimmed-XML bug, which the Phaser 3 preset avoids. Packer head-to-head on 5 real frame sets (CodeAndWeb free web packer, GAPTools, free-tex-packer): smallest sheet on all 5 with rotation allowed, 4 of 5 without; every frame restored pixel-exact.

Limits

Aseprite JSON is one page; very large sets need an engine preset with multipack.
Layers are not exported as separate sheets.
Polygon (mesh) packing is not offered: none of the verified engines draws a mesh atlas from exported data.
GameMaker strips are UNVERIFIED in GameMaker itself.
Scale variants (@0.5x–@4x) use nearest-neighbour only.
Trimmed Starling XML is drawn wrongly by Phaser 3.90; use the "Sparrow XML (Phaser 3)" preset there.

Versions and sources

Nerulio's Aseprite JSON was loaded by Phaser 3.90 and 4.2 with load.aseprite and createFromAseprite, and its frames by PixiJS 8.21; a JSON made by Aseprite itself passed the same checks as a reference. The .aseprite reader behind it was checked on 231 real files. The Aseprite and Phaser details above follow their documentation.

Official documentation used

Questions

Why is Aseprite JSON limited to one page?

An Aseprite JSON file describes one image, and Phaser's load.aseprite reads it that way, so this target re-packs onto a single page. For sets that need several pages, the Phaser preset writes a multiatlas and PixiJS 8 links its pages with related_multi_packs.

Why are the frame keys "0", "1", "2"?

Phaser's createFromAseprite looks frames up by number, so the export uses the --filename-format "{frame}" form. Phaser 3.90 and 4.2 loaded it with load.aseprite, and PixiJS 8.21 read its frames.

Two of my tags share frames. Is one of them lost?

No. In Aseprite JSON a tag is a from..to range, so a frame used by two tags, or a tag whose frames are out of order, gets a second entry pointing at the same region. The export notes how many entries it repeated.

Is it free, and do I need an account?

Everything on these pages is free and works without an account. There is no watermark and no export that is held back.

Are my sprites uploaded?

No. The Studio decodes, packs and exports in this browser tab. Projects are autosaved in the browser (IndexedDB) and can be saved as a .nerulio file.

Does it need Aseprite or an engine plugin installed?

No. .aseprite files are read and written in the browser, and each engine bundle carries what that engine needs (for Godot, the import settings and scene; for Unity and the Godot TileSet, a small editor script).