Email Image Size Guide: Best Dimensions for Every Client

Getting your email signature image size wrong means your logo gets clipped in Outlook, your banner looks blurry in Gmail, or your entire message lands in the promotions tab because it weighs 3MB. Every email client handles images differently — different max widths, different rendering engines, different file size thresholds before they block images entirely.

This guide gives you the exact dimensions and file sizes that work across Gmail, Outlook, Apple Mail, and Yahoo for signatures, marketing emails, and everything in between.

Email Image Size Quick Reference

Here are the recommended dimensions for every common image type across major email clients:

Client-specific limits:

Outlook is the troublemaker. It uses Word's rendering engine on desktop, which means no CSS background images, limited support for modern image formats, and aggressive image blocking for first-time senders. Design for Outlook first and everything else will work.

Email Signature Image Best Practices

Your email signature gets seen hundreds of times a day. A bloated signature image slows every message you send and annoys recipients on slow connections.

Logo dimensions: 300–400px wide, height proportional. This displays crisply on desktop and scales down cleanly on mobile. Going wider than 400px adds file size without visible benefit — most email clients constrain the signature area anyway.

Headshot dimensions: 100–150px square. Crop tight, use JPG at 80% quality. A 150×150px headshot at 80% JPG quality typically lands around 15–25KB — small enough that it loads instantly.

Format choice: Use PNG for logos that need transparency (your logo on any background color). Use JPG for photographs. Avoid GIF for anything except actual animations, and even then, keep animated GIFs under 500KB or they will not load in many clients.

The 100KB rule: Keep your total signature — images plus HTML — under 100KB. Recipients with image blocking enabled (most corporate Outlook users) will see a broken image icon for every oversized file. A lightweight signature loads before anyone notices it.

You can resize your logo to exact pixel dimensions and then compress it under your target file size in one step — no need to bounce between tools.

Email Marketing Image Sizes

Marketing emails follow different rules than signatures. You have more space but also more at stake — a slow-loading promotional email gets deleted, not waited for.

Header/banner images: 600px wide is the industry standard. This width fits cleanly inside every major email client's content area without horizontal scrolling. Height varies by design, but 150–200px is typical for a banner. Keep text in HTML, not baked into the image — screen readers cannot read image text, and it looks terrible when images are blocked.

Hero images: 600×300px strikes the right balance between visual impact and file size. For retina displays, you can design at 1200×600px and set the display width to 600px in your HTML — but compress aggressively or you will double your file size for a sharpness difference most recipients will not notice.

Product images: 300×300px for two-column layouts, 600px wide for single-column features. Consistency matters more than size here — mismatched product image dimensions make your email look thrown together.

Total email weight: Keep all images combined under 1MB. Under 500KB is better. Gmail clips emails larger than 102KB of HTML (not including images), so bloated emails get a "View entire message" link that kills engagement. Every image you add should justify its weight in click-throughs.

For a deeper dive on compression targets, see our guide on how to reduce image file size without destroying quality.

How to Resize and Compress Images for Email with Pixotter

Pixotter processes everything in your browser — no uploading to a server, no waiting for a round trip.

1. Drop your image onto Pixotter's resize tool
2. Set the width to your target (600px for banners, 300px for signature logos)
3. Add compression — set a target file size or quality percentage. For email signatures, aim for under 100KB. For marketing images, under 200KB per image
4. Pick the format — keep PNG if you need transparency, convert to JPG for photos
5. Download your optimized image, ready to embed

The entire pipeline runs client-side in WebAssembly. Your images never leave your machine. For batch work — resizing a dozen product images for a promotional email — drop them all at once and apply the same settings across the set.

Need to hit a precise file size? Our guide on compressing images to 50KB walks through the exact steps.

Common Email Image Mistakes

Using full-resolution photos. A 4000×3000px photo from your phone is 5–8MB. Even if the email client scales it down visually, it still downloads the full file. Recipients on mobile data will not thank you. Resize before embedding — always.

Wrong format for the job. PNG for photographs produces files 3–5× larger than JPG at equivalent visual quality. JPG for logos with transparency produces a white box where the transparent background should be. Match the format to the content.

Skipping alt text. When images are blocked (Outlook's default for unknown senders), alt text is the only thing recipients see. "IMG_4521.jpg" tells them nothing. "Spring sale — 30% off all plans" tells them everything. Alt text is not optional.

Images wider than 600px. On desktop, they might display fine. On mobile, they either get squished (distorted aspect ratio) or trigger horizontal scrolling (immediate delete). Design for 600px wide and let the email client scale down for smaller screens.

Embedding instead of hosting. Base64-encoded inline images inflate your HTML size and often trigger spam filters. Host images on your domain or CDN and reference them with <img> tags. The exception: signature images under 50KB, where inline embedding guarantees they display regardless of image blocking settings.

FAQ

What is the best image size for email signatures?

A logo should be 300–400px wide and under 100KB. A headshot should be 100–150px square and under 50KB. Use PNG for logos that need transparency and JPG for photographs.

What dimensions should email marketing images be?

Use 600px wide for headers, banners, and hero images — this fits every major email client. Product images work best at 300×300px in two-column layouts. Keep total email size under 1MB.

Why do my images look blurry in email?

You are likely using an image that is too small and the email client is scaling it up. Design at the exact target dimensions (or 2× for retina and set display width in HTML). Avoid scaling up — it always looks soft.

Does Gmail block images in emails?

Gmail shows images by default for most senders. Outlook desktop blocks images by default for unknown senders. Apple Mail and Yahoo show images by default. Design with alt text as a fallback regardless of the client.

What image format is best for email?

JPG for photographs and complex images with many colors. PNG for logos, icons, and anything requiring transparency. Avoid WebP and AVIF in email — client support is inconsistent and your images will break in Outlook.

How do I reduce image file size for email without losing quality?

Resize to the exact display dimensions first (do not send a 2000px image to display at 600px), then compress. JPG at 80% quality is visually identical to 100% at roughly half the file size. Use Pixotter's compression tool to hit a specific target size while previewing the result.

Need image sizes for other platforms? See our guides for LinkedIn banner sizes, Shopify image sizes, and Instagram image sizes.