Add a Shadow to a Logo
Give a flat logo a soft shadow so it lifts off a light background instead of looking pasted onto it.
Free preview · No signup · ~10 seconds
Drop a transparent logo PNG
PNG, JPG, WebP or SVG — up to 20 MB
Drop several at once — you can edit them all together in the app.
Runs entirely in your browser. Your image is never uploaded.
What a shadow does for a flat mark
Depth comes from restraint
A shadow you consciously notice is too strong. The effect works when it reads as the mark sitting slightly above the surface, which usually means a wide blur, a small vertical offset, and low opacity — not a hard dark line.
The canvas grows
A shadow needs room, so the output is larger than the input by the blur radius plus the offset. Nothing is cropped, and the new margin is transparent, so the file still drops cleanly onto any layout.
It needs a transparent source
The shadow is cast from the alpha channel, so it traces the actual shape of your mark. A logo on a white rectangle casts a rectangular shadow, which is almost never what anyone wants. Make it transparent first.
Match the shadow to the surface
Pure black shadows look heavy on coloured backgrounds. A very dark version of the background hue reads as more natural. On a dark surface a shadow does nothing at all — use a glow instead.
Bake it in or apply it in CSS
For the web, a CSS box-shadow is more flexible and costs no pixels. Bake the shadow into the file when the logo is going somewhere with no styling layer: a slide, a PDF, a marketplace listing, an email.
How to add a shadow to a logo
Upload your logo
Drop in a transparent PNG so the shadow traces the real shape of the mark.
Shape the shadow
Adjust blur, vertical offset, and colour. Wide and soft reads as depth; tight and dark reads as a sticker.
Download
Take a free preview, or download the full-resolution PNG with one credit.
Where a logo shadow helps
Slides and decks
Stop a flat logo looking pasted onto a white slide.
Marketplace listings
Add depth where you have no control over the surrounding page styling.
Email headers
Bake in the depth that email clients will not render from CSS.
Mock-ups
Show a mark in context with a hint of elevation.
Or just ask
Describe the edit in your own words
Type what you want changed and the assistant does it on the canvas — each step lands as a layer you can reopen, so nothing it does is baked in.
No edits yet.
Frequently Asked Questions
Related Tools
Guides worth reading
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.
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 Fix Blurry or Fringed Edges on a Transparent PNG
Why your transparent PNG has a white halo, a grey fringe or soft edges — the four real causes, how to tell them apart in seconds, and the fix for each.
Add a shadow to your logo
Upload, shape the shadow, and download the result.