Overview
Introduction
This tool cleans up an icon PNG's edges by removing isolated, stray non-transparent pixels, entirely in your browser using the HTML canvas API.
It's a simple despeckle pass that's especially useful after a background-removal or masking step leaves behind single-pixel artifacts.
What Is Icon Edges Cleaner?
A client-side icon despeckler that reads an uploaded icon's pixel data and, for every non-transparent pixel, counts how many of its 8 surrounding neighbors are also non-transparent.
Any pixel with fewer neighbors than your chosen minimum is treated as noise and made fully transparent, leaving the rest of the icon untouched.
How Icon Edges Cleaner Works
For each pixel with a non-zero alpha channel, the tool checks all 8 surrounding pixels (including diagonals) and counts how many of them are also non-transparent.
If that count is below the minimum-neighbors threshold you set, the pixel's alpha is forced to 0, erasing it; every other pixel is copied through unchanged.
When To Use Icon Edges Cleaner
Use it right after a chroma-key or background-removal step on an icon, when the edges show a scattering of single-pixel artifacts rather than a clean silhouette.
It's also handy for tidying up icons exported from design tools that leave faint anti-aliasing fringes behind.
Often used alongside Icon Background Remover and PNG Transparency Checker.
Features
Advantages
- Runs entirely client-side; the uploaded icon is never sent to a server.
- Simple, predictable rule (a neighbor-count threshold) that's easy to reason about and tune.
- Preserves the icon's original dimensions and every pixel that isn't flagged as noise.
Limitations
- This is a local neighbor-count heuristic, not true noise detection — it can't distinguish a stray pixel from a genuinely thin one-pixel-wide detail.
- A single despeckle pass won't clean up larger clumps of unwanted pixels; those need a different tool like background removal or manual editing.
Examples
Best Practices & Notes
Best Practices
- Start with the default minimum of 2 neighbors and only increase it if visible speckling remains.
- Preview the result before downloading, since a high threshold can erode fine detail along thin edges.
Developer Notes
The pure despeckle logic is reused as-is from the base PNG Edges Cleaner's cleanPngEdges function (a plain function over a Uint8ClampedArray pixel buffer, no DOM); this tool is a thin, subject-relabeled wrapper (cleanIconEdges) around that same lib function, since despeckling an icon's edges is identical pixel math to despeckling any other PNG's edges.
Icon Edges Cleaner Use Cases
- Cleaning up an icon after chroma-key background removal
- Tidying edge artifacts before exporting an app icon
- Removing compression-introduced fringe pixels from a sprite
Common Mistakes
- Setting minNeighbors too high on a thin or spiky icon, which can erase intentional fine detail along with noise.
- Expecting this to fix large blotches of unwanted color — it only removes small, sparsely-connected pixel clusters.
Tips
- Combine with the Icon Background Remover: run background removal first, then clean the edges to erase leftover fringe pixels.
- If the icon still looks speckled after one pass, try running the tool again with the same settings rather than raising the threshold too high at once.