Remove the Space Around an Icon
Crop an icon tight to the glyph so it matches the optical size of every other icon in your set.
Describe the edit — the AI assistant does it on the canvas.
Free preview · No signup · ~10 seconds
Drop an icon
PNG, JPG, WebP or SVG — up to 30 MB
Runs entirely in your browser. Your image is never uploaded.
Why icon padding matters more than logo padding
Inconsistent padding is why sets look wrong
Icons pulled from different sources carry different amounts of built-in margin. Rendered at the same box size, one looks large and the next looks small — not because the glyphs differ but because their padding does. Trimming them all to their own bounds is what makes a mixed set look designed.
Trim, then set the padding once
Strip every icon to its glyph, then apply one consistent clear space across the whole set. That is the only way to get optical consistency, and it is much easier to reason about than adjusting each icon against the others.
Trimming changes the aspect ratio
A tightly trimmed icon is no longer square, because most glyphs are not. If the destination expects a square, square it back up afterwards rather than relying on the original padding to do it.
Not for app icons
App and launcher icons are specified with a required safe area — the padding is part of the spec, not an accident. Trim interface icons, not the ones you submit to a store.
Alpha preserved
The glyph comes back with its transparency intact, ready to drop into an interface at whatever size you need.
Building a consistent icon set
Trim all, then pad all
Optical consistency comes from applying one padding value to a set of tightly trimmed glyphs — never from adjusting icons against each other.
Leave store icons alone
App store and launcher icons have a specified safe area. That padding is required, not accidental.
Expect a rectangle
A trimmed glyph is only square if the glyph was. Square it back afterwards if the slot demands it.
How to remove the space around an icon
Upload the icon
A transparent PNG export.
Trim to the glyph
The default removes fully transparent margin. Adjust the tolerance for a soft-edged glyph.
Download
Free preview, or the full-resolution icon in the app.
Where a tight icon is required
Normalising a mixed set
Make icons from different sources render at the same optical size.
Interface icons
Strip built-in padding so your own spacing rules apply.
Button and toolbar glyphs
Get consistent alignment inside a fixed control.
Icon font preparation
Give every glyph a tight bounding box before packaging.
Used by designers, indie devs & students at
What people use it for
The jobs the editor was built around — and what it does differently on each one.
Colourways you can revisit
Every edit is a layer, not a bake. When the brand shifts, reopen the file and change the colour rather than rebuilding the variant from the original.
Cutouts with awkward edges
AI background removal that keeps hair, foliage and soft shadows instead of stamping a hard outline around them. The output is a transparent PNG, ready to place.
No export, edit, re-import loop
The Framer plugin runs on the canvas you are already working in, so a recolour or a cutout does not mean a round trip through a second application.
Ten options in the time one used to take
Recolour once and step through the alternatives, so a client review can look at the whole range instead of the one version there was time to make.
Brand colours matched exactly
Pick a colour straight off an existing asset and get the hex, rather than eyeballing it against a screenshot and hoping it is close enough.
Free to preview, priced per export
Previewing is unlimited and costs nothing. A credit is spent only when you download a full-resolution file, so exploring an idea is never the expensive part.
Frequently Asked Questions
Related Tools
Guides worth reading
How to Replace a Color in Photoshop (4 Methods, and Why the Edges Go Wrong)
Replace Color, Hue/Saturation on a targeted range, Color Range plus a fill layer, and Selective Color — which to use when, and why a recolored logo keeps a halo of the old color along its edges.
How to Get Your Website Ready for Google WebMCP
A step-by-step guide to exposing WebMCP tools on your site — the imperative and declarative APIs, how to test them, and the real security downsides.
How to Remove a Background in Canva (And What the Free Plan Actually Gives You)
Canva's BG Remover is a paid feature — and so is downloading the result with transparency. Here is what works on a free account, what the two separate paywalls are, and how to get a clean cut-out either way.
Trim your icon
Tight to the glyph, transparency intact.