Remove a Sprite Sheet Background — Magenta or Flat Colour to Alpha

Old sheets and many asset packs use a key colour instead of transparency. The Studio measures the border colour of the sheet, proposes it as the key with a confidence, and only replaces it when you apply the import.

Many old sheets use a key colour, often magenta #ff00ff, instead of transparency. Drop the sheet: Nerulio measures its border, proposes the key colour with a confidence, and applies it on its own only when the evidence is strong. Every pixel of that colour then gets alpha 0, exactly for a clean PNG or within a tolerance measured from the border for a JPEG-damaged one. The original stays stored for undo, and the frames are cut afterwards.

Drop a sprite sheet, numbered frames, a GIF / APNG or an .aseprite file

Open the empty Studio

Runs in your browser. Files are not uploaded.

The real Studio with a CC0 asset (OpenGameArt).

Exports to

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

How the key colour is found

A backdrop surrounds the art, so the detector starts at the border: the most common border colour is the candidate. It then checks how much of the border has that colour, how much of the whole sheet has it (it must be between 10 % and 97 %), whether it appears on all four sides, and whether whole rows or columns are that colour, as the spacing lines of a keyed grid are.

Confidence is high when at least 75 % of the border is the colour, or at least 40 % together with four or more full lines; only then is it applied automatically. Medium and low results are shown with the colour so you can apply it yourself. A sheet whose border is already more than half transparent gets no key: it uses alpha, and a key would erase content.

The tolerance comes from the border too. A PNG key is one exact colour (tolerance 0). JPEG compression spreads it, so the detector measures how far near-key border pixels drift (95th percentile, within 48 RGB levels) and allows that plus 2, at most 64. The key is global: key-coloured pixels inside a sprite become transparent as well, and every keyed pixel keeps its RGB under alpha 0.

Key colour: A colour that means “nothing here”; conventional ones are magenta, cyan, green, red, blue and yellow.
Tolerance: Allowed RGB distance from the key colour; 0 means exact.
Alpha: Opacity per pixel; keyed pixels get alpha 0.
Fringe: Edge pixels blended between the art and the key colour. They are not the key colour, so they stay.

Example: a magenta sheet with margin and spacing

sheet          267 × 135 px: 8 × 4 cells of 32 × 32, 2 px margin, 1 px spacing
border         100 % #ff00ff             → ≥ 75 %: confidence high, applied
full lines     margin and spacing rows and columns are all #ff00ff
tolerance      0: every border pixel is exactly #ff00ff
result         every #ff00ff pixel → alpha 0; the grid then finds 32 frames

JPEG version   near-key border pixels drift up to 9 levels → tolerance 9 + 2 = 11
               pixel (250, 6, 247): distance √(5² + 6² + 8²) ≈ 11.2 > 11 → kept

That last pixel is the typical fringe case: close to magenta, but not close enough, so it stays opaque and pink. The tolerance is measured, not typed in.

What it does

Key colour proposed from the sheet itself, shown with a confidence and one-click alternatives (including "no key colour").
Pixels matching the key colour become transparent — exactly for a clean PNG key, within a small tolerance measured from the border when the key was blurred by JPEG; the original sheet is kept.
Frames are cut afterwards by the measured grid or by transparent gaps (islands).
Works on sheets with margin and spacing, and on large effect sheets.

How to do it

Drop the sheet.
Check the "Background colour" decision in the Import panel; if it is wrong, switch between the detected colour and "no key colour".
Press Apply: the key colour turns transparent and the frames are cut.
Continue with animations or export.

Check the result

Import panel: the Background colour decision shows the colour, the confidence and the reasons (border share, sheet share, full lines, tolerance).
Open the floating preview (F7) on a contrasting background: no key-coloured pixels should remain between frames or around outlines.
Undo once to compare with the untouched original; the import is a single undo step.

Troubleshooting

Symptom	Likely cause	How to check	Fix
A pink or green outline remains	The art was anti-aliased or resized against the key colour, so the edge pixels are blends, not the key	Zoom in on an edge: the outline pixels are mixtures of art and key	Nerulio does not un-blend keyed edges on import; recolour the edge in the pixel editor or export the source again with real transparency
Holes inside the sprite	The sprite uses the key colour itself, and the key applies to the whole sheet	The holes have exactly the key colour	Choose “no key colour”, or recolour those pixels in the source first
The background was not removed	Confidence was medium or low: the colour is missing on one side, the sheet already uses transparency, or too little of the border has it	The decision's reasons	Click the detected colour (the alternative) to apply it anyway
The wrong colour was detected	The most common border colour is not the backdrop, for example a scene that runs to the edges	The decision names the colour	Choose “no key colour”; the Studio offers only the detected colour or none, so fix the backdrop in an image editor first
Speckles remain on a JPEG sheet	Compression noise beyond the measured tolerance, or beyond the maximum of 64	The tolerance in the reasons	Use a PNG original if there is one; JPEG noise cannot be keyed cleanly

Other ways to do it

Option	When it is the better choice
Export the source with transparency	You have the original project (Aseprite, Photoshop …): real alpha is better than any key.
An image editor's select-by-colour and delete	You need to key one region only, pick the colour yourself, or clean a fringe by hand.
Continue to an .aseprite file	After keying you want frames, tags and timing in Aseprite.

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

Only the colour detected from the border can be applied; there is no colour picker for the key.
The key applies to the whole sheet, not to one region.
Soft anti-aliased edges against the key are not repaired.
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

Key detection is tested on synthetic keyed sheets (a magenta grid with 2 px margin and 1 px spacing is keyed and cut into 32 frames exactly) and on real Kenney sheets such as a magenta roguelike dungeon set with 16 px tiles and 1 px spacing; a sheet that already uses alpha, and an opaque noise texture, get no key.

Questions

Will it remove colours inside my sprite?

Only pixels matching the key colour change (exactly, for a clean PNG key). If your sprite uses the same colour inside, choose "no key colour" and recolour those pixels first.

Can I get the original back?

Yes. The untouched sheet is stored with the import, and one undo restores it.

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).