Every graphic design project moves through at least three stages: creation, refinement, and delivery. Each stage has formats that work and formats that will ruin your day. Sending a client a 400MB PSD when they need a PDF. Exporting RGB artwork for a CMYK press run. Delivering a raster logo that turns to mush at billboard scale.
This guide maps the entire format landscape for graphic designers — from source files through final delivery, with the specific export settings that matter. No vague advice like "use high quality." Actual numbers, actual specs, actual workflows.
Whether you work in Photoshop, Illustrator, Figma, or Affinity, the format rules are the same. The tools change; the physics of pixels, vectors, and color spaces don't.
Source File Formats: Where Design Happens
Source files are your working documents — layered, editable, and massive. They contain the full creative state: layers, masks, artboards, smart objects, type, and effects. Never deliver these to clients unless specifically requested (and even then, flatten what you can).
PSD (Photoshop Document)
What it stores: Layers (up to 8,000), adjustment layers, masks, smart objects, type layers, vector shapes, channels, paths, and embedded ICC profiles. Maximum canvas: 300,000 x 300,000 pixels (PSB format for files over 2GB).
Color depth: 8-bit, 16-bit, or 32-bit per channel. Use 16-bit for photo compositing where you need headroom for extreme adjustments (exposure recovery, heavy color grading). 8-bit is fine for web graphics and most print work.
File sizes: A typical multi-layered social media graphic (1080x1080, 15 layers) runs 20–50MB. A photo composite at 16-bit (4000x3000, 40 layers) easily hits 500MB–1GB. Smart objects containing full-resolution photos are the biggest space eaters.
Interoperability: Affinity Photo reads PSD files reasonably well (layers, masks, adjustment layers). GIMP handles basic PSDs but mangles adjustment layers and smart objects. Figma doesn't open PSDs at all. For cross-tool handoff, flatten to TIFF or export layers as PNG.
Convert PSD to PNG | Convert PSD to JPG | Convert PSD to PDF
AI (Adobe Illustrator)
What it stores: Vector paths, anchor points, bezier curves, type (as outlines or live text), gradient meshes, effects, multiple artboards, embedded or linked raster images, swatches, and symbols. AI files are actually PDF-based internally — you can rename .ai to .pdf and open it in any PDF reader (though you'll only see the flattened preview).
Key setting: "Create PDF Compatible File" in Save options. Keep this on. It embeds a PDF representation that allows other apps (InDesign, Keynote, Preview) to display the file. Without it, only Illustrator can open it. The tradeoff: files are roughly 2x larger with this enabled.
Alternatives: Affinity Designer uses .afdesign (vector, similar capabilities, reads AI files with limitations). Inkscape uses SVG natively. For collaboration, export to SVG or PDF rather than relying on proprietary format compatibility.
Convert AI to SVG | Convert AI to PNG | Convert AI to PDF
Figma and Sketch Files
Figma (.fig): Cloud-native — there is no local file you edit directly. Figma stores everything server-side. You can export a .fig backup, but it's only openable in Figma. For handoff, export frames as PNG, SVG, or PDF. Figma's SVG export is good but adds extra grouping elements; clean up with SVGO if file size matters.
Sketch (.sketch): macOS-only, stores vectors, symbols, and shared styles. The .sketch format is a ZIP archive of JSON + binary assets, which means it's version-controllable with Abstract or Git LFS. Sketch files don't open in Figma natively (use a converter). For web handoff, export to SVG or PNG.
InDesign (.indd): The only serious option for multi-page layout — books, magazines, catalogs, brochures. INDD files link to external assets (images, fonts) rather than embedding them. Always package (File > Package) before handoff to collect all linked assets into one folder.
Print Deliverables: PDF/X, TIFF, and EPS
Print deliverables must carry the right color information (CMYK or spot colors), correct resolution (300dpi minimum), and proper geometry (bleed, trim marks). Sending an RGB JPEG to a commercial printer is the design equivalent of submitting a Word doc when someone asked for a spreadsheet.
PDF/X for Print
PDF/X-1a: The safest choice for commercial printing. All fonts embedded (or outlined), all images CMYK or spot, no RGB, no transparency (flattened on export). Maximum compatibility with every print RIP. Use this when you don't know the printer's capabilities.
PDF/X-3: Allows Lab color and ICC-based color management. Use when you want the RIP to handle CMYK conversion using its own profiles — common in high-end packaging and fine art printing.
PDF/X-4: Supports live transparency and layers. Modern RIPs handle this well, and it produces smaller files than PDF/X-1a (which flattens everything). Ask your printer if they support X-4 before sending it.
Critical settings: Embed all fonts (or convert to outlines). Set bleed to 3mm (0.125") on all sides. Output at 300dpi for images, 1200dpi for vector-raster boundaries. Flatten transparency for X-1a. Include trim marks and color bars if the printer requests them.
TIFF for Print
TIFF (Tagged Image File Format) is the workhorse for high-quality raster output. Every print shop, prepress house, and publishing workflow accepts TIFF without question.
Print specs: CMYK color mode, 8-bit or 16-bit per channel, 300dpi at final output size, LZW or ZIP compression (both lossless — no quality loss). A full-page magazine image (8.5"x11" at 300dpi) in CMYK runs about 25–30MB with LZW compression, 90–100MB uncompressed.
When to use TIFF over PDF: Single images going into someone else's layout (InDesign, QuarkXPress). Stock photography delivery. Archival copies of finished artwork. Photo retouching handoffs between studios.
Convert PNG to TIFF | Convert JPG to TIFF | Convert TIFF to PDF
EPS (Legacy Format)
Encapsulated PostScript was the standard vector exchange format from the late 1980s through the early 2000s. It's a PostScript program wrapped in a bounding box, optionally with a TIFF or WMF preview image.
Current status: Effectively dead for new work. PDF replaced EPS for print exchange. SVG replaced EPS for digital exchange. Some stock agencies and print shops still accept EPS, but virtually all of them also accept PDF, which is superior in every way (smaller files, live transparency, better compression, embedded fonts).
When you'll still see EPS: Legacy logo files from the 2000s, some stock photography sites, clip art collections, and the occasional printer who hasn't updated their workflow in 20 years. Convert to SVG for web or PDF for print. Convert EPS to SVG | Convert EPS to PDF
Screen Deliverables: PNG, WebP, SVG, and AVIF
Screen delivery means RGB color, sRGB color space (unless targeting wide-gamut displays), and the smallest file size that preserves acceptable quality. The format choice depends on the content type and where it's displayed.
PNG: The Universal Screen Format
Use PNG for: Screenshots, UI elements, logos with transparency, graphics with text, anything needing pixel-perfect lossless quality. PNG supports full 8-bit alpha transparency — smooth anti-aliased edges against any background.
Optimization: Run through a PNG optimizer (TinyPNG, pngquant, OptiPNG) before delivery. A typical screenshot drops 40–70% in file size with no visible quality loss. pngquant converts 24-bit PNG to 8-bit indexed PNG with alpha, achieving massive savings for graphics with limited color palettes.
Don't use PNG for: Photographs. A 1920x1080 photo is 3–5MB as PNG versus 200–400KB as JPG at quality 85. The lossless compression provides no visible benefit for photographic content while costing 10–20x the file size.
Convert PSD to PNG | Convert SVG to PNG | Convert WebP to PNG
WebP: The Web Performance Format
WebP replaces both JPG and PNG for web delivery. Lossy WebP is 25–35% smaller than JPG. Lossless WebP is 26% smaller than PNG (Google's published benchmarks). All modern browsers support it — Safari was the last holdout and added support in 2020.
When to use: Any image on a website, web app, or email where the recipient's client supports it. Use lossy WebP (quality 80–85) for photos, lossless WebP for graphics and screenshots.
When not to use: Print delivery (no CMYK), archival (TIFF or PNG), anywhere you need >8-bit color depth (use AVIF), or destinations that don't support it (some email clients, older enterprise software).
Convert PNG to WebP | Convert JPG to WebP | Convert PSD to WebP
SVG: Scalable Vector Graphics
SVG is XML-based vector graphics for the web. Logos, icons, illustrations, data visualizations, and UI elements should be SVG whenever possible. The file is resolution-independent — crisp at any size, from favicon to billboard.
Best practices: Optimize with SVGO (removes editor metadata, simplifies paths, strips whitespace). A logo exported from Illustrator might be 15KB; after SVGO, 3KB. Inline small SVGs directly in HTML to eliminate HTTP requests. Use viewBox for responsive scaling.
Limitations: SVG is terrible for photographic content (it's vector, not raster). Complex illustrations with thousands of paths produce enormous SVGs that are slower to render than a raster equivalent. If your SVG exceeds 100KB, consider whether a rasterized WebP would be faster.
Convert AI to SVG | Convert EPS to SVG | Convert SVG to PNG
AVIF: Next-Generation Web Format
AVIF uses the AV1 video codec for still images. It beats WebP on compression efficiency by another 20–30%, supports 10-bit and 12-bit color depth (HDR), and handles wide color gamut (P3, Rec.2020).
Browser support (2026): Chrome, Firefox, Safari, Edge — all supported. Encoding is 5–10x slower than WebP, so batch conversion of large image libraries takes planning. Decoding speed is comparable to WebP.
When to use: Web delivery where you need maximum compression (bandwidth-sensitive mobile experiences, image-heavy pages), HDR photography on wide-gamut displays, replacing WebP for even smaller files.
Convert PNG to AVIF | Convert JPG to AVIF | Convert WebP to AVIF
Color Modes and Resolution: The Settings That Matter
Getting format choice right is only half the equation. Color mode and resolution mismatches cause the most expensive reprints and the most embarrassing client deliveries.
CMYK vs RGB: Print vs Screen
RGB (Red, Green, Blue): Additive color model for screens. 16.7 million colors at 8-bit. Every screen deliverable should be RGB with an embedded sRGB profile. Designing for Apple displays? Use Display P3 for that 25% wider gamut, but provide an sRGB fallback.
CMYK (Cyan, Magenta, Yellow, Key/Black): Subtractive color model for print. Smaller gamut than RGB — saturated blues and greens shift noticeably during conversion. Always soft-proof (View > Proof Colors in Photoshop) before converting to CMYK to preview how the shift will look.
The conversion trap: RGB-to-CMYK conversion is lossy and non-reversible. Converting CMYK back to RGB won't recover the original colors. Design in the target color mode from the start when possible. If you must convert, do it as the last step before export.
Resolution: DPI/PPI by Output Type
Print: 300ppi at final output size. A 10"x8" print needs a 3000x2400px image minimum. Large format (banners, posters viewed from distance) can go lower: 150dpi for posters, 72–100dpi for billboards (viewed from 20+ feet). Ask the print shop — they know their equipment's sweet spot.
Screen: Pixel dimensions matter, not DPI. A 1920x1080 image is 1920x1080 regardless of whether the DPI field says 72 or 300. The DPI metadata is meaningless for screen display. Export at the exact pixel dimensions needed. For Retina/HiDPI, export at 2x (a 400px wide element needs an 800px image at 2x).
The myth: "72dpi for web" is a relic from 1990s Mac displays that were literally 72 pixels per inch. Modern displays range from 100ppi (budget monitors) to 460+ppi (phones). The DPI field in your image metadata has zero effect on how it displays on screen. Only pixel dimensions matter.
Bleed and Trim for Print
Bleed: Extra image area (typically 3mm / 0.125") beyond the trim edge. It's there so the guillotine cutter has room for imprecision. Any background color, image, or element that touches the edge of the page must extend into the bleed area.
Trim marks: Small lines at the corners showing where the page will be cut. Required by most print shops. Export them in your PDF/X preset — most apps have a checkbox for this.
Safe zone: Keep important content (text, logos) at least 5mm (0.2") inside the trim line. Paper can shift during cutting, and content too close to the edge risks being trimmed off.
Export Cheat Sheet by Deliverable
| Deliverable | Format | Color | Resolution | Notes |
|---|---|---|---|---|
| Business cards | PDF/X-1a | CMYK | 300dpi + 3mm bleed | Outline all text |
| Brochure / flyer | PDF/X-1a or X-4 | CMYK | 300dpi + 3mm bleed | Embed ICC profile |
| Magazine ad | PDF/X-1a | CMYK + spots | 300dpi | Check publisher specs |
| Large format banner | TIFF or PDF | CMYK | 150dpi at full size | Check printer's max width |
| Website hero image | WebP (JPG fallback) | sRGB | 1920px wide | Quality 80–85 |
| Social media post | JPG or PNG | sRGB | Platform-specific | PNG for text-heavy |
| Logo for web | SVG | sRGB | N/A (vector) | Optimize with SVGO |
| Logo for print | PDF or AI | CMYK or Pantone | N/A (vector) | Outline fonts |
| App icon | PNG | sRGB | 1024x1024px | No alpha for iOS |
| Favicon | ICO or SVG | sRGB | 16x16, 32x32, 48x48 | SVG for modern browsers |
| Email newsletter image | JPG or PNG | sRGB | 600px wide max | No WebP/AVIF in email |
Common Conversion Workflows
Most design projects involve multiple format conversions. Here are the workflows that come up repeatedly.
Logo Package Delivery
A complete logo delivery package includes: SVG (web, scalable), PNG at multiple sizes (1024px, 512px, 256px, 128px, 64px) with transparent background, PDF (print vector), EPS (legacy compatibility), JPG on white background (email, documents). Provide each in color, black, white, and reversed variants. That's 20–40 files for a thorough package.
AI to SVG | AI to PNG | SVG to PNG | PNG to ICO
Photo Editing to Print
Workflow: Open RAW in Lightroom/Camera Raw (RGB, 16-bit) → Edit in Photoshop (stay 16-bit RGB) → Soft-proof with CMYK profile → Convert to CMYK (Edit > Convert to Profile) → Save as TIFF 8-bit CMYK with LZW compression → Place in InDesign layout → Export as PDF/X-1a.
The key: stay RGB as long as possible. Every CMYK conversion is destructive, so do it once, at the end.
PSD to PDF | TIFF to PDF | JPG to TIFF
Design to Web Assets
From Figma: Select frame → Export as SVG (icons, logos) or PNG 2x (complex graphics) → Optimize (SVGO for SVG, TinyPNG for PNG) → Convert to WebP for production (PNG to WebP).
From Photoshop: Export As (not Save for Web, which is deprecated) → WebP quality 80 for photos, PNG-24 for graphics with transparency → Optimize with your build tool or convert PNG to WebP.
Responsive images: Export at 1x, 2x, and 3x for srcset. Use WebP with JPG fallback via <picture> element. AVIF for maximum compression where supported.
Format fluency separates professional designers from the ones who deliver broken files. The rules aren't complicated once you internalize them: vectors for scalable graphics, rasters for photographs, CMYK for print, RGB for screen, and the right compression for the right content.
When in doubt, ask the recipient what they need. A 30-second conversation about format requirements prevents hours of rework. And when you need to convert between formats quickly, ChangeThisFile handles the most common conversions without installing anything.