Tap the background to remove it · Adjust tolerance · Export transparent PNG · 100% browser-only, nothing uploaded
Every indie game developer eventually hits the same wall: you find a great pixel art sprite on OpenGameArt or Itch.io, but it has a solid background — usually pure white, magenta, or some arbitrary color the original artist used as a transparency key. Removing it sounds trivial until you realize your options are: install GIMP, pay for Photoshop, or upload your asset to a service that may log, watermark, or retain your work.
I built this tool specifically for the sprite pipeline. It does one thing fast: tap a background color, dial in a tolerance, and get a clean transparent PNG back in seconds. Everything runs in the browser via the HTML5 Canvas API. Nothing is transmitted to any server. Your sprites stay yours.
When you tap a pixel on the canvas, the tool reads that pixel's red, green, and blue channel values directly from the image data in memory. It then compares that color against every pixel in the image using Chebyshev distance — the maximum absolute difference across all three channels: max(|R₁−R₂|, |G₁−G₂|, |B₁−B₂|). If that distance is less than or equal to the tolerance you've set, the pixel's alpha channel is set to zero, making it fully transparent.
This global color-match approach is intentional. Unlike a flood-fill selection (which only removes connected regions of the same color), this tool removes every pixel in the image matching each picked color — including isolated background pixels hiding inside the sprite's design, or background fragments scattered across a sprite sheet with many frames.
The checkerboard pattern in the preview is the standard convention for indicating transparency. Here it's rendered via a CSS background on the container behind the canvas. Transparent canvas pixels have alpha zero, so the CSS checkerboard shows through them exactly where the background has been removed — giving you an accurate live preview of the output.
The Chebyshev metric was chosen deliberately over Euclidean distance for pixel art work. It treats the RGB color space as a cube and creates a cube-shaped removal region around each picked color. This behaves more uniformly across all hue directions than Euclidean distance, which tends to over-remove warm or cool tones relative to their perceived visual similarity to the target.
Yes. The tool runs fully in mobile browsers on iOS and Android. Use "From Gallery" to access your photo library or "From Files" to navigate your file system. Once the image loads, simply tap anywhere on the background area of the preview to remove that color — no extra steps required. Use the Lock button to freeze picking mode when you want to inspect the result without accidentally adding colors.
Any format your browser can decode: PNG, JPG, WebP, BMP, GIF (first frame only), and AVIF. The output is always a transparent PNG regardless of the input format. If you upload a JPG, the output PNG will be larger in file size because PNG is lossless — this is expected behavior, not an error.
No. The entire process runs inside your browser tab using the HTML5 Canvas API and JavaScript. The image is read from your device's local file system and never sent to any server. Closing or refreshing the tab discards everything — ORH Studio stores and logs nothing from this tool.
Yes. Each tap on the canvas adds a new color entry to the list. All colors are processed together — a pixel becomes transparent if it matches any color in the list within the current tolerance value. This lets you handle backgrounds with gradients, multiple solid areas, or subtle color variation across a large sprite sheet in a few taps.
Fringe pixels appear when the artwork uses anti-aliasing — the edge pixels are a blend of the background color and the sprite color, so they're neither the exact background nor the exact sprite. Try increasing the tolerance slider by 10–20 to catch them. If increasing tolerance also removes sprite content you want to keep, the image has significant anti-aliasing and may need per-pixel editing in a tool like Aseprite for a clean result.
Clicking "↩ Undo" removes the most recently picked color from the list and immediately re-renders the preview without it. You can undo one color at a time, stepping back through your taps. To remove a specific color without disturbing the others, click the ✕ button on that color's row. "🗑 Clear" removes all picked colors at once, restoring the preview to the original unmodified image.
The tolerance slider applies globally to every color in the list simultaneously. Moving the slider immediately re-renders the preview using all picked colors at the new tolerance value. If you need different effective tolerances for different colors, pick the colors that need lower tolerance first, check the preview, then adjust and pick the remaining colors.
Photoshop's Magic Wand does a flood-fill selection starting from the clicked pixel — it only selects contiguous regions of similar color. This tool does a global color match — every pixel anywhere in the image that matches any picked color is made transparent. For sprite sheets where background color appears in many disconnected regions between frames, the global approach is faster. If you need to preserve isolated same-colored pixels inside the sprite body, a contiguous selection tool like Magic Wand gives finer control.
Yes. The downloaded file is a standard PNG with a full alpha channel. In Godot 4, import it as a Texture2D — transparency is preserved automatically. In Unity, set Texture Type to "Sprite (2D and UI)" in the import settings and the alpha channel is read correctly. Both engines display transparent sprites without any additional conversion steps required.
There is no server-side limit because no server is involved. Processing runs entirely in the browser tab using JavaScript typed arrays. Images up to 2000×2000 pixels process almost instantly. Very large images (4096×4096 and above) may take a second or two to render after each change, which is normal for browser-based pixel processing. The tolerance slider has a short debounce to keep the UI responsive while dragging.
Sprite Background Remover is part of a suite of free browser-based tools for game developers and pixel artists.
© 2026 ORH Studio. All rights reserved.
Home | About | Privacy Policy | Terms of Service | Contact