Softonic

Image Shadow Adder

Step 1 / 4 Drop shadow

A flat product screenshot lifts off the page with a soft drop shadow; the same shot without one looks pasted in. This tool adds a customisable shadow with independent controls for blur radius, offset, spread and colour, producing a PNG with the shadow baked in, ready for marketing pages, blog headers and documentation.

How to add a drop shadow

  1. 1

    Upload an image

    Works best with PNG that already has transparency or a product screenshot you want to frame.

  2. 2

    Set shadow parameters

    Blur radius, X/Y offset, opacity, colour.

  3. 3

    Pick a canvas

    Fit to image plus shadow, or fixed size with padding.

  4. 4

    Export

    PNG output preserves the soft shadow edges; JPG will have a visible background.

Shadow settings that feel right

Good drop shadows are usually softer and less opaque than people instinctively pick.

Preset styles

Style Blur Offset Y Opacity Spread
Subtle lift (UI card) 12 px 2 px 8% 0
Material elevation 2 8 px 2 px 15% 0
Material elevation 8 24 px 12 px 20% 0
Social media post 40 px 20 px 25% 0
Floating hero image 80 px 40 px 30% 0
Long shadow (flat design) 0 px 40 px 30% 0

Shadow colour

  • Black is easy but often looks harsh. A dark desaturated version of the image’s dominant colour looks more integrated.
  • Pure black at 25% opacity is usually better than black at 70%.
  • Warm shadows under a warm image, cool shadows under a cool image.

Where the light is

If your image has an internal sense of lighting (a logo with highlight), match the shadow’s direction to that lighting. Generic photo screenshots usually look best with a top-down light (shadow offset downward by 2-20 px).

PNG vs JPG output

  • PNG: shadow edges fade to transparency cleanly. Best for placing the image on any background.
  • JPG: shadow is flattened against a chosen background colour. Use when you know the final placement background.

Avoid stacking effects

A drop shadow plus a thick border plus rounded corners plus a tint begins to look busy. Pick one or two, a subtle border plus a shadow is usually enough.

Frequently Asked Questions

Almost always opacity is too high. Reduce to 20-30% and increase blur radius. Real shadows in daylight are diffuse; a sharp, dark shadow reads as stage lighting.

The tool produces outer drop shadows only. For inset shadows (e.g. text pressed into a surface), use a dedicated bevel/emboss filter.

Yes by default, the canvas expands to include the shadow extents. You can lock the canvas to the original size if you prefer the shadow to clip at the edges (for tiling or continuous backgrounds).

Yes. PNG input with alpha produces a shadow around whatever is opaque, not around the full rectangle. Product cutouts with complex silhouettes render natural, shape-conforming shadows.

Related Tools

Image Resizer

Resize images to pixel-exact dimensions or percentages while preserving aspect ratio. Batch-friendly, no upload.

Material Design Color Picker

Browse the Material Design color palette. Copy any shade (50 through A700) as HEX, RGB or HSL with one tap.

QR Code Generator

Generate a browser-local QR code from a plain text or URL payload. Adjust size, colours and error correction, then download PNG.

Barcode Generator

Create a 1D barcode in your browser in Code 128, EAN, UPC, ITF-14 and other supported formats. Download the rendered result as SVG or PNG.

Tier List Maker

Create a private tier list with text and local images. Customize rows, rank by drag or keyboard, recover locally, and export JSON, PNG or SVG.

JPG to Excel Converter

Run local OCR on a JPG or JPEG table image and download the inferred rows as XLSX or UTF-8 CSV. Files up to 20 MB stay in your browser.

Tool available in other languages