How to resize a banner or header image

Banners are the hardest images to get right, because they are displayed at completely different shapes depending on the device.

Resize an image
Whichever tool you use here, the file stays on your device. How that works

Step by step

  1. 1Add JPG, PNG or WebP images and choose custom dimensions or a preset.
  2. 2Keep the shape lock on for proportional resizing; each source keeps its own aspect ratio.
  3. 3For exact width and height, crop to that ratio first, then disable the lock and set both numbers.
  4. 4Resize and check each result's displayed pixel dimensions before saving.

The centre is the only part you can rely on

Crop to the banner's intended proportions while keeping the subject and wording inside its usable area. Check small text after resizing and any additional crop at the destination. This tool changes dimensions, not the banner design.

Locked resizing keeps each image's proportions. Fixed dimensions can stretch images; crop to the required ratio first.

The encoder creates a new file. Upscaling cannot recover detail that the original did not contain.

Cropping to the banner shape first

A banner is far wider than it is tall, perhaps four times as wide. Forcing a normal photo to that shape in one step stretches it. Instead, crop the photo to the banner shape with Crop & rotate, using Free to draw a wide, short box, and then resize it to the exact size.

Keep what matters in the middle of the crop, because some sites trim the left and right on small screens. Check the result at the size your page will show it before you upload it.

Questions

Does this guarantee an upload KB limit?

No. Check dimensions here, then use Compress to a size if the destination separately limits file size.

What if the picture will not resize?

JPG, PNG and WebP always open. Other types depend on your browser, so convert them first with Convert format. A very large photo can run out of memory on a phone, so try a computer.

Can I get an exact banner size in one step?

You can force the exact width and height, but that stretches a photo of a different shape. Cropping to the shape first and then resizing gives a natural result.

Related jobs and next steps

How to resize an image to exact pixel dimensionsWhen a form demands 800 by 600 exactly, here is how to hit it without stretching the picture.How to resize images for social mediaCrop and resize a picture to the shape a platform actually displays, so nothing important gets cut off. Runs on your own device.How to make photos the same sizeResize a batch of images to identical dimensions in one pass, for a grid, a document or a listing. Never uploaded.

Tools that help with this job

Resize an image
Compress imageJPG, PNG and WebP, one or a hundredCrop & rotateQuarter turns, flips and ratio cropsConvert formatJPG, PNG and WebP, both directionsImage to PDFTurn photos and scans into a PDF