Email Newsletter Image Sizes & Limits

Keep each newsletter image under 100 KB, size images to twice their display width, and use JPG or PNG rather than WebP. Gmail truncates any message whose Hypertext Markup Language (HTML) exceeds roughly 102 KB, replacing the rest with a View entire message link.

Most senders discover the clipping limit the hard way, usually when the unsubscribe link and the tracking pixel fall below the cut. Images are frequently the reason, either because they are embedded directly in the message or because the markup around them has grown over several campaigns.

What the Gmail clipping limit actually measures

Gmail measures the HTML source of the message, not the images it links to. A newsletter linking to 10 large photographs stays well inside the limit, while a message with heavy inline styling and embedded images does not.

The distinction matters because the fix differs. Linked images do not count toward the 102 KB figure, so clipping is usually caused by repeated inline styles, long tracking parameters on every link, or images embedded as base64 data. Removing embedded images and trimming the markup solves clipping, while compressing linked photographs solves load time.

Recommended image sizes for email

Design the email body at 600 pixels wide and export images at 1200 pixels for high density screens. The 600 pixel standard has held for years because it fits every desktop client preview pane without horizontal scrolling.

Doubling the export width covers high density displays and stops there. Exporting at 3 times the display width adds weight that no email client renders any better, and email is the one channel where every kilobyte is downloaded on a phone.

Why WebP is still the wrong choice in email

Email client support for WebP remains uneven, and Outlook in particular stays unpredictable. Email is one of the few places left where the safe old formats are the right call.

Web browsers all support WebP, which leads people to assume email clients do too. Desktop Outlook renders messages with a different engine entirely, and several corporate mail systems strip or fail on formats they do not recognise. A broken image in a newsletter is far more costly than the 30 percent file saving WebP would deliver, so JPG and PNG remain correct here.

Format choice inside the email

Use JPG for photographs and PNG for logos, buttons and anything containing text. The rule is the same as on the web, and the consequences are more visible because email images are often small.

• JPG for product photographs, header imagery and any picture of a real scene.
• PNG for logos, icons and graphics with flat colour or sharp text edges.
• Animated GIF only when the animation carries meaning, and kept under 1 MB.
• Avoid WebP and AVIF, since neither renders reliably across all mail clients.
• Avoid SVG entirely, because most email clients block it for security reasons.

Images are blocked by default in many clients

Many recipients see your email with images turned off, so the message must still work as text. Corporate mail systems and privacy conscious users both block remote images until the reader chooses to load them.

Write alt text on every image, since blocked images display that text instead. Never place essential information, including the offer, the deadline or the call to action, inside an image alone. A newsletter built entirely from one large graphic becomes a blank rectangle for a significant share of the list, and it also performs badly with screen readers.

How to prepare newsletter images

To keep a newsletter fast and readable, follow these 7 steps.

1. Design the email at 600 pixels wide, which every desktop client renders without scrolling.
2. Crop each image to the exact shape it will occupy in the layout.
3. Resize to twice the display width, and no further.
4. Convert to JPG for photographs or PNG for graphics containing text.
5. Compress each file to a target under 100 KB.
6. Host images on your sending platform or your own server rather than embedding them in the message.
7. Send a test to Gmail, Outlook and a phone before scheduling the campaign.

Total email weight matters more than any single image

Keep the whole message under 600 KB including images, because subscribers open newsletters on phones, often on poor connections. A 5 MB newsletter loads slowly and gets closed before it renders.

Count the images before compressing anything. A newsletter carrying 12 photographs at 100 KB each is already at 1.2 MB, which suggests the layout needs fewer images rather than smaller ones. Reducing image count usually improves both performance and readability, since long image heavy newsletters are rarely read to the end.

Dark mode changes how images look

Several clients invert or adjust colours in dark mode, and a logo on a white background becomes a bright rectangle in a dark message. Test every campaign in dark mode before sending.

Use PNG files with transparent backgrounds for logos and icons so they sit correctly on either colour. Avoid images with white backgrounds where the design assumes the page behind them is also white. Photographs are generally safe, since clients rarely alter photographic content, while flat graphics and text images are where dark mode problems appear.

Retina screens and image sharpness

Export at twice the display width so images stay sharp on high density screens, then compress harder to offset the extra pixels. A 1200 pixel image at quality 70 usually looks better and weighs less than a 600 pixel image at quality 95.

Set the width attribute in the markup to the display size rather than the file size, so the client renders the image at 600 pixels while using the extra detail. Omitting the width attribute causes some clients to display the image at its full pixel size, which breaks the layout on desktop.

Checking a campaign before it sends

• Send a test to Gmail, Outlook, Apple Mail and at least one phone.
• View the test with images blocked, confirming the message still makes sense.
• Check the message is not clipped in Gmail, which shows a View entire message link at the cut.
• Confirm every image has alt text describing what it shows.
• Check dark mode rendering, particularly for logos and flat graphics.
• Add the total weight of all images and confirm it stays under 600 KB.

Preparing a campaign in one batch

Process every image in the newsletter together so the whole campaign shares one specification. A newsletter typically carries 5 to 15 images, and a weekly sender prepares hundreds over a year.

Set the width and the KB target once, drop the images in, and each file comes back matched. Everything runs inside your browser on your own processor, so unannounced offers, subscriber lists rendered as images and client campaign work never reach a server. For an agency preparing a launch, keeping those files local avoids a disclosure that no compression saving would justify.

Keep a template folder of correctly sized placeholders for each recurring layout block, such as the header, the 2 column product row and the footer logo. Weekly senders reuse the same 4 or 5 shapes indefinitely, and matching new artwork to an existing specification takes less time than deciding the dimensions again for every campaign.