How to export PSD to JPG, PNG, or WebP — every method that actually works

Photoshop saves layered, editable masters as PSD. But the rest of the world wants flat web images. This guide covers the four reliable paths from PSD → JPG/PNG/WebP, with the trade-offs and exact settings for each.

Method 1 — Online (no Photoshop installed)

If you only need to convert a PSD that someone sent you, the fastest path is browser-based. KaijuConverter handles PSD natively via ImageMagick and a libpng/libwebp pipeline:

• PSD to JPG — flatten + RGB sRGB output, ~80% quality default
• PSD to PNG — preserves transparency from the PSD
• PSD to WebP — best size/quality ratio for web delivery

The conversion runs server-side, returns the flat image in seconds, and supports files up to 500 MB (1 GB on paid plans). Behind the scenes it's magick input.psd -flatten -strip output.jpg with a smart-enough default profile handling.

Limitations of any online tool: the conversion always merges all visible layers. If you need to export individual layers as separate files, you need Photoshop or GIMP locally.

Method 2 — Photoshop "Export As" (best quality control)

For interactive single-image export, File → Export → Export As... (Cmd/Ctrl+Alt+Shift+W) gives the most control:

• JPG: choose Quality 60–80 for web, 100 for print mockups. Convert to sRGB checked. Embed Color Profile checked if displaying outside the browser.
• PNG: pick PNG-8 only for icons with ≤256 colors; PNG-24 for everything else with transparency; PNG-32 (24+alpha) for photos with transparency.
• WebP: Photoshop 24+ supports WebP natively. Quality 75 is the sweet spot — usually 25-35% smaller than the equivalent JPG at the same visible quality.

Always check Convert to sRGB before exporting for web. Photoshop documents created from RAW or print workflows often live in Adobe RGB or ProPhoto RGB — leaving them in those profiles makes browsers render colors slightly off because most don't honor embedded profiles outside <img> tags.

Method 3 — Save for Web (Legacy) — when you need exact file size

File → Export → Save for Web (Legacy) (Cmd/Ctrl+Alt+Shift+S) is the only Photoshop UI that shows live file size and a preview pane. Use it when you need to hit a specific file weight (banners with strict KB caps, programmatic ads, email templates).

Trade-off: it strips metadata aggressively (loses EXIF if you wanted to keep it), and the JPG encoder is older — slightly less efficient than modern libjpeg-turbo. For brand mockups or photography keep "Export As".

Method 4 — Command-line batch with ImageMagick

If you have a folder of 500 PSDs to convert, scripting wins:

# Single file
magick mockup.psd -flatten -strip -quality 85 -colorspace sRGB mockup.jpg

# Batch all PSDs in current folder
for f in *.psd; do
  magick "$f" -flatten -strip -quality 85 -colorspace sRGB "${f%.psd}.jpg"
done

# Parallel batch with xargs (uses all CPU cores)
ls *.psd | xargs -P $(nproc) -I {} \
  magick "{}" -flatten -strip -quality 85 -colorspace sRGB "{}".jpg

Key flags:

• -flatten merges all visible layers into one
• -strip removes XMP metadata, IPTC tags and embedded thumbnails
• -quality 85 — JPG only, ignored for PNG
• -colorspace sRGB — converts from Adobe RGB / ProPhoto / CMYK to web-safe sRGB

For PNG output skip -quality and add -define png:compression-level=9 for maximum (slow) compression. For WebP use -quality 75 -define webp:method=6 (slowest but most efficient encoder pass).

Method 5 — Python with Pillow + psd-tools

When you need to extract individual layers, generate variants programmatically, or integrate with a build pipeline:

from psd_tools import PSDImage

psd = PSDImage.open('design.psd')

# Export the merged composite
psd.composite().save('design.png')

# Export each top-level layer separately
for layer in psd:
    if layer.is_visible():
        layer.composite().save(f'{layer.name}.png')

# Export a specific layer group
hero = next(l for l in psd if l.name == 'Hero')
hero.composite().save('hero.png')

This unlocks workflows Photoshop UI cannot match — generating per-language variants, applying Pillow filters before save, or feeding the layers into ML pipelines.

Pitfall — transparent PSD → JPG = white background

JPG does not support transparency. When you export a PSD that has a transparent canvas, every tool fills the transparent area with white by default. If you wanted black, gray or any other color:

# Flatten transparent PSD onto black background
magick design.psd -background black -flatten -alpha remove design.jpg

# Or onto a custom hex color
magick design.psd -background "#1a1a1a" -flatten -alpha remove design.jpg

In Photoshop UI: before exporting, add a solid-color layer at the bottom of the layer stack with the desired background color.

Pitfall — color shift between PSD and exported JPG

Three causes, in order of frequency:

1. Wrong color profile — PSD is Adobe RGB, exported JPG embedded sRGB but pixel values not converted. Fix: explicitly convert (Image → Convert to Profile → sRGB) before export.
2. CMYK PSD exported to JPG — JPG technically supports CMYK but most browsers don't. Convert to sRGB first.
3. 16-bit PSD exported to 8-bit JPG without proper rounding — banding in gradients. Fix: Image → Mode → 8 Bits/Channel with dither enabled before export.

Decision matrix

Related conversions

• PSD to PNG — preserve transparency from layered design
• PSD to JPG — flatten and compress for web delivery
• PSD to WebP — modern web format, smaller files
• PSD to PDF — for print-style sharing of layered designs
• PSD to TIFF — preserve quality for print production
• PSD to GIF — when you need an indexed-color export