Remove the Space Around a Logo
Crop a logo tight to its own artwork — cut the transparent margin a design tool left behind, in one step.
Describe the edit — the AI assistant does it on the canvas.
Free preview · No signup · ~10 seconds
Drop a logo
PNG, JPG, WebP or SVG — up to 30 MB
Runs entirely in your browser. Your image is never uploaded.
Why exported logos come with dead space
Where the margin comes from
Export a logo from a design tool and you usually get the artboard, not the artwork. That leaves a band of transparent pixels on every side which are invisible until the logo has to line up with something — and then they are the reason it will not.
It breaks alignment silently
A logo with 40 pixels of dead space on the left sits 40 pixels right of where the CSS says it should. Every attempt to fix that in the layout is fighting the file rather than the stylesheet, and the margin moves again the next time someone re-exports.
Trim first, then pad deliberately
The right sequence is to strip the accidental margin, then add back the clear space your brand guidelines actually specify. That way the padding is a decision rather than an artefact of whoever exported the file.
Transparency survives
The alpha channel is preserved exactly. The logo comes back tight to its own bounds and still drops onto any background.
Watch a soft glow
If the logo carries a drop shadow or a glow, the faint outer pixels are part of the artwork and the trim will keep them. Raise the tolerance to cut through a very soft edge, but check you have not clipped the shadow you wanted.
Getting logo spacing right
Trim, then pad on purpose
Strip the accidental margin first, then add the clear space your guidelines specify. Otherwise the spacing is whatever the last export happened to produce.
Check the shadow
A glow or drop shadow is real pixels and will be kept. Raising the tolerance to remove it can clip the mark, so review the result.
Normalise a whole set
Running every export through this gives a folder where each file measures from the artwork, so they finally align to each other.
How to remove the space around a logo
Upload the logo
A transparent PNG export is the usual case.
Check the tolerance
The default suits a clean export. Raise it for a soft glow, lower it if the mark is being clipped.
Download
Free preview, or the full-resolution file in the app.
Where the extra space causes trouble
Fixing web alignment
Stop a header logo sitting off-centre because of invisible padding.
Slide templates
Get a mark to sit flush in the placeholder it was given.
Email signatures
Remove the gap that pushes a signature logo away from the text.
Brand asset cleanup
Normalise a folder of exports so they all measure the same way.
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 Change a Logo Color in Figma (4 Methods, Step by Step)
A complete guide to recoloring a logo in Figma — the Fill row, the Selection colors panel that swaps one hex everywhere at once, the clipped-rectangle trick for placed PNGs, and why the export panel has no WebP.
How to Make a Vector Logo (and When You Actually Need One)
What vector really means, the three honest routes from where you are now, when auto-tracing works, and how to check the result is genuinely vector.
SVG vs PNG for Logos: Which File Do You Actually Need?
What SVG and PNG really are, where each one wins, why your developer keeps asking for the SVG, and the three files that cover almost every request.