Sprite Editor Online — From Art File to Engine-Ready Sprites
Nerulio Studio is a sprite editor built around game work. Bring the sheet, frames, GIF or .aseprite file you already have, and it becomes timed animations with pivots and boxes, packed into the files your engine opens; when a frame needs touching up, the Pixel workspace paints it in the same project — all inside one browser tab.
A sprite editor for games does two jobs: painting the pixels of each frame, and turning frames into something an engine plays, with tags, per-frame timing, pivots, boxes, a packed atlas and the engine's data file. Nerulio Studio does both in one browser project: the Pixel workspace paints (pencil, bucket, shapes, selections, layers, palettes, onion skin), the Sprite workspace times and marks frames, and Pack & Export writes Godot 4, Unity 6 and 16 other formats. Long painting sessions, tilemap layers or scripted workflows are still a job for Aseprite.
- Godot 4Verified· Godot 4.7.2
- Unity 6Verified· Unity 6000.5.3f1
- Phaser 3 / 4Verified· Phaser 3.90 + 4.2
- PixiJS 8Verified· PixiJS 8.21
- Aseprite JSONVerified· Phaser load.aseprite · 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
Two halves of sprite editing
Painting is about pixels: a canvas, a palette, layers, a pencil that never anti-aliases, and onion skin to draw in-betweens. Preparation is about data: which frames form "run", how long each one shows, which pixel sits on the character's position, where the attack hits, and how all of that is written for Godot, Unity or Phaser. Many tools do one half well; the hand-off between them (export a sheet, re-slice, re-type the timing) is where timing, pivots and alignment get lost.
In the Studio both halves edit the same frames. A stroke in the Pixel workspace is one undo step on the current frame; switching to the Sprite workspace shows the same frame on the timeline with its duration, pivot and boxes. Projects autosave in the browser's IndexedDB and can be saved as a .nerulio file; nothing is uploaded.
Exports are checked against the engines themselves: a verified target was loaded and drawn by that engine from a bundle made in the UI, and the target's line says so; GameMaker is labelled UNVERIFIED because no GameMaker could be run.
- Pixel workspace
- Painting: pencil, eraser, bucket, shapes, selections, layers with blend modes, indexed palettes, onion skin.
- Sprite workspace
- Frames as data: import, timeline, tags, durations, pivots, boxes, alignment.
- Pack & Export
- Atlas packing and the engine files.
Example: a four-frame walk from a blank canvas to Unity 6
Each line is one step in one project.
Pixel new sprite 32 × 32, 4 frames, 16-colour palette, onion skin on
Sprite tag walk = frames 1–4, 120 ms each → 480 ms per cycle (8.33 FPS)
pivot (0.5, 1.0) = pixel (16, 32); hurt box 12 × 26 at (10, 6)
Pack Unity preset: trim, 2 px shape padding, no rotation → one page
Export hero.png + hero.unity.json + Editor/NerulioSpriteImporter.cs + README-UNITY.md
Unity Tools › Nerulio › Import Studio JSON → 4 sprites (Point, uncompressed) + walk.animThe hurt box does not reach Unity (it has no sprite field for it); the Godot bundle and the generic JSON carry it, see the hitbox editor.
Where each part of the job happens
| Job | In Nerulio Studio | In a dedicated pixel editor such as Aseprite |
|---|---|---|
| Paint and edit pixels | Pixel workspace, Aseprite shortcuts, 19 layer blend modes, indexed palettes and Lospec palettes | Aseprite has a fuller painting toolset, tilemap layers and scripting; Nerulio lacks layer groups, tilemap layers, RotSprite and text |
| Tags and per-frame timing | Sprite timeline; reads and writes .aseprite tags and durations | Aseprite's own timeline and tags |
| Pivots and hit / hurt boxes | Pivot tool and box tools per frame, tag or selection | Slices with a pivot point, drawn by hand |
| Engine files | Pack & Export: 18 formats with engine-checked presets | Sprite sheet + JSON; engine files come from plugins or importers |
What it does
- Five workspaces are live: Sprite (import, timeline, pivots, boxes), Pixel (a pixel editor with palettes and upscale cleanup), Pack & Export (atlas packing and 18 output formats), Tile (autotile rules and test maps) and Texture (normal maps and 2D lights). One project holds them all.
- Every automatic guess on import — grid, key colour, islands, one animation per row — is listed with a confidence (high, medium or low), its reasons and one-click alternatives. Nothing is cut until you press Apply, and Apply is a single undo step.
- Frame editing on whole pixels: the pivot tool (P), rectangle, circle and polygon boxes (B, C, Q), a mirrored copy of a tag, and Align frames, which moves art without ever resampling it.
- Your work stays on your machine: projects autosave in the browser's IndexedDB and can be saved as a .nerulio file. No account, no watermark, no upload.
- Drawing happens in the Pixel workspace on the same frames: pencil, bucket, selections, layers, indexed palettes and onion skin on Aseprite's keys. It lacks some Aseprite tools (layer groups, tilemap layers, RotSprite, text), so a heavy painting job may still start in Aseprite.
How to do it
- Draw in the Pixel workspace or in your usual pixel editor, and keep a PNG sheet, numbered frames, a GIF or the .aseprite file itself.
- Drop it on this page; the Sprite workspace opens with the proposed cut and the reasons behind it.
- Press Apply, then shape the result: name tags on the timeline, type durations, place a pivot per frame and draw hit or hurt boxes.
- Open Pack & Export, pick Godot 4, Unity 6 or another of the 18 formats, and download the bundle for your project.
Check the result
- Play each tag in the Sprite workspace at the zoom you ship at (F7 preview, 1×–8×).
- Read the verification line of the export target before exporting, and the notes after.
- Open the bundle in the engine and play the same tag next to the Studio preview.
The six Studio workspaces
What each workspace does today, and where the unfinished one sends you instead.
| Workspace | What you do there today | Status |
|---|---|---|
| Sprite | Import sheets, frame files, GIF / APNG, .aseprite and atlas data; timeline with tags and per-frame durations; pivots, boxes, collision polygons; Align frames | Live |
| Pack & Export | MaxRects, Skyline or Guillotine packing with trim, alias, extrude and multipack; 18 formats, from Godot 4 and Unity 6 to CSS sprites and GIF | Live |
| Tile | Recognise an autotile layout from the pixels, set terrain bits, list missing tiles, paint a test map, generate full sets; Godot, Tiled, Unity and LDtk files | Live |
| Texture | Generate a normal map from the sprite's silhouette, light it the way Godot 2D does, check OpenGL vs DirectX; Godot and Unity bundles | Live |
| Pixel | Pencil, bucket, shapes and selections on Aseprite keys; layers with 19 blend modes; indexed palettes and Lospec; onion skin; cleanup of upscaled pixel art back to 1× | Live |
| UI | Nine-slice panels, button states and bitmap fonts — the UI Lab does these today | Coming (UI Lab meanwhile) |
Troubleshooting
| Symptom | Likely cause | How to check | Fix |
|---|---|---|---|
| Pixels look blurry in the engine | The engine filters the texture instead of using nearest-neighbour | Zoom in: edges are soft | Keep the shipped import settings (Point in Unity, Nearest in the Godot scene) or set nearest filtering in the engine |
| The Unity importer script does not compile | The 2D Sprite package (com.unity.2d.sprite) is missing, for example in a 3D template | Console errors about UnityEditor.U2D.Sprites | Install the 2D Sprite package, then import again |
| Colours change in an exported GIF | More than 255 colours are reduced by median cut, and alpha becomes on or off | The export notes say the palette was reduced | Export PNG or APNG where colours must stay exact |
| Work is gone after clearing the browser | Projects autosave in the browser's storage, which clearing site data removes | The project list is empty | Save a .nerulio file for anything you want to keep |
Other ways to do it
| Option | When it is the better choice |
|---|---|
| Aseprite (desktop) | Long painting sessions, tilemap layers and scripting. Nerulio reads and writes .aseprite, so the two can be combined: see Aseprite alternatives. |
| The engine's editor (Unity Sprite Editor, Godot SpriteFrames panel) | Slicing and animating one sheet inside the project, when timing is even and nothing else is needed. |
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
GIF decoder: 408 of 408 frames identical to Pillow on 29 real GIFs; APNG 132 of 132 on 16 files. .aseprite: 231 corpus files imported, re-written and reopened in Aseprite 1.3.18 with the same tags, durations and pixels (231/231). 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.
Limits
- The Pixel workspace lacks layer groups, tilemap layers, RotSprite and text.
- The UI workspace (nine-slice, button states, bitmap fonts) is not in the Studio yet; the UI Lab does those.
- GameMaker export is UNVERIFIED in GameMaker.
- A grid or island guess is a preview with a confidence; nothing is cut until you press Apply, and every choice has one-click alternatives.
- .aseprite files whose layers do not compose exactly (e.g. group opacity) are imported flattened, and the Import panel says why.
- Rotated frames in an imported atlas stay rotated; their export is UNVERIFIED.
- Images up to 32,768 px per side (268 million pixels), subject to your browser's memory.
Versions and sources
231 of 231 .aseprite test files came back into Aseprite 1.3.18 with the same tags, durations and pixels; the Unity 6 export was applied by Unity 6000.5.3f1 in batch mode (rects, pivots, pixels, clip keys).
Official documentation used
Questions
Can I paint pixels in this sprite editor?
Yes, in the Pixel workspace: switch to it with the Pixel tab and the pencil, eraser, bucket, shapes and selections work on the current frame, each stroke one undo step. Files from Aseprite, Pixelorama or Piskel still come in: .aseprite with its layers, tags, durations and slices, the others as a PNG sheet or frame files.
Is this the same as Unity's Sprite Editor?
No. Unity's Sprite Editor slices a texture inside a Unity project. This runs in a browser tab, measures the grid for you, and writes a JSON plus a small editor script that creates the sprite rects, pivots and one AnimationClip per tag in Unity 6 — checked in Unity 6000.5.3f1 batch mode.
How big a sheet can it open?
Images up to 32,768 px per side (268 million pixels), as far as your browser's memory allows. The packer handled 1,000 frames in 2.4 s in a Chromium worker, and Cancel stops a pack at once.
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).