Image Resize
Scales an image to an exact size or fits it inside a bounding box, with optional cropping and a live file-size preview, entirely in your browser.
Last updated 2026-08-06
Summary#
Image Resize scales a picture to an exact width and height, or fits it inside a bounding box, with optional cropping to a chosen aspect ratio. The new file size updates live as you adjust the controls, and the whole thing runs in your browser — the image is never uploaded.
Purpose#
Most images that reach a website are far larger than the space they occupy. A 4,000-pixel photograph in a 900-pixel column costs your visitors bandwidth and costs you Core Web Vitals, and the usual fix — an external converter site — means handing your file to a stranger. This tool does the same job locally, so nothing leaves your computer and there is nothing to pay.
Overview#
Drop an image onto the page or pick one from your machine. It loads into a preview with two panels: the picture on the left with its original and new file size, and the size controls on the right.
Choose a preset or type an exact width and height, pick how the image should fill that box, and the preview re-renders continuously with the resulting file size counting up or down beneath it. When you are satisfied, press Resize and the file downloads. Nothing is sent to Metric Vault except a small record of the run for your Library.
The screen carries the eyebrow Image Resize, the heading Resize Images, and the note: "Everything runs in your browser, so your images are never uploaded."
Benefits#
- Completely private: the file stays in your browser, and no server sees it.
- Free, with no credit cost and no quota impact.
- Live file-size feedback, so you can see the trade before you commit to it.
- Cropping and resizing in one pass, with fixed aspect ratios for social and video sizes.
- Metadata control: keep EXIF and IPTC, or strip it before publishing.
Use Cases#
- Shrinking a photo for a blog post. A 6 MB camera file becomes a few hundred kilobytes at the width your template actually renders.
- Preparing a social image. The 1:1 and 4:5 crop presets match the common feed shapes without opening an editor.
- Fixing a Core Web Vitals warning. PageSpeed & Vitals flags an oversized image; you resize it to the rendered size and the warning clears.
- Removing location data. Stripping metadata before publishing a photograph taken on a phone removes its embedded GPS coordinates.
- Batch-standardising a set. Running each file through the same preset gives a consistent library.
Requirements#
- A signed-in Metric Vault account, because the dashboard itself requires sign-in.
- Any plan, including Free.
- No credits.
- An image file in PNG, JPEG, WebP, GIF or BMP, up to 30 MB.
- A modern browser. All the work happens locally, so there is no server fallback.
Permissions#
There is no plan gate and no role gate on this tool. Everyone who can open the dashboard can use it, on every plan including Free. Signed out, you see the dashboard's own gate — Sign in to continue — rather than the tool.
Cost#
Free. 0 credits. Image Resize makes no provider call and no AI call, and it never touches a quota gate, so it cannot consume your monthly allowance or count toward the hourly fair-use limit. Runs are recorded in your Library with a cost of zero. See How credits work.
Because there is no server work, there is nothing to cache. See Result caching and freshness.
Navigation Path#
Dashboard → Image Tools → Image Resize
Inputs#
| Field | Accepts | Required | Default | Validation | Notes |
|---|---|---|---|---|---|
| Drop zone / Choose an image | PNG, JPEG, WebP, GIF or BMP | Yes | — | That file is not an image. for a non-image; That image is larger than 30 MB. over the size cap; That image could not be read. if the file is corrupt | Drag and drop or the file picker both work |
| Size preset | Small (fits within 854 × 480 pixels), Medium (1366 × 768), Large (1920 × 1080), Phone (320 × 568), Custom | No | Custom | — | Choosing a preset fills the width and height boxes; typing in either box switches back to Custom |
| Width / Height | A number, minimum 1 | Yes | The image's own dimensions | Blank or zero is treated as the minimum | Step is 1 in pixels and percent, 0.1 in inches and centimetres |
| Fit mode | Fit, Fill, Stretch | No | Fit | — | Fit scales inside the box keeping the shape; Fill fills the box and crops the overflow; Stretch forces the exact box and distorts the shape |
| Unit | Pixels, Percent, Inches, Centimeters | No | Pixels | — | Inches and centimetres convert using the image's own DPI where it carries one, otherwise 96 |
| Make pictures smaller but not larger | Checkbox | No | Off | — | Prevents upscaling: a box larger than the source is ignored |
| Ignore the orientation of pictures | Checkbox | No | On | — | When off, a portrait image given a landscape box has the box swapped to match |
| Overwrite files | Checkbox | No | On | — | On keeps the original filename. Off appends (resized) before the extension |
| Remove metadata that doesn't affect rendering | Checkbox | No | Off | Locked on for WebP output | Unchecked keeps EXIF, XMP, IPTC and comments from the original |
| Crop | Drag box with eight handles | No | Off | Minimum selection 16 pixels on screen | Aspect presets Free (default), 1:1, 4:3, 16:9, 4:5; confirm with Apply crop or discard with Cancel |
The output format follows the source: a PNG stays PNG, a WebP stays WebP, and everything else — JPEG, GIF, BMP — is written as JPEG. To change format, use Image Reformat.
Step-by-Step Guide#
- Open
Dashboard → Image Tools → Image Resize. - Drag an image onto the drop zone, or click Choose an image.
- Optional: click Crop, drag the selection box, choose an aspect preset, and click Apply crop.
- Pick a preset from the size menu, or type a width and height.
- Choose the unit and the fit mode.
- Tick Make pictures smaller but not larger if you never want the image enlarged.
- Decide whether to keep the original filename with Overwrite files, and whether to strip metadata.
- Watch the New size figure and the savings bar until you are happy.
- Click Resize. The file downloads and the panel shows
Saved <filename>. - Click Resize another to start again, or Cancel to discard.
Reading the Results#
There is no report here — the result is the preview and the two numbers under it, and they update continuously as you change any control.
The Preview panel shows the image at the shape and proportion it will have after resizing and cropping, not the original. If you set a Stretch fit and the picture looks squashed on screen, that is exactly what the downloaded file will look like. Use the preview as the check, not the assumption.
Original shows the source dimensions and file size, in the form 3024 x 4032 4.1 MB. New size shows the same for what will be written. The number animates as it changes so you can see the direction of travel; it turns green when the new file is smaller than the original.
The savings bar beneath them is the clearest signal on the page. Its fill represents the new file as a proportion of the original, and the label reads N% smaller, N% larger or same size. Aim for a bar that is well under half full. If it reads same size or larger, something is wrong with your settings — almost always an upscale, or a PNG source where the pixel reduction is small enough that the format's overhead cancels it out.
The Size readout next to the Size label shows the exact output dimensions in pixels, whatever unit you are working in. Check it before downloading when you are working in percent, inches or centimetres, because that is the number the browser will actually write. Output is clamped to a maximum of 12,000 pixels on either axis.
During cropping, the Selection readout reports the crop box in source pixels, so you can size a selection precisely rather than by eye. Applying a crop with the Custom preset and pixel units also updates the width and height boxes to the cropped size, which is usually what you want.
The metadata note under the checkboxes tells you what is at stake: Unchecked keeps EXIF, XMP, IPTC and comments from the original, or This picture carries no metadata to keep when there is none, or WebP output cannot carry EXIF, so metadata is always removed when the source is a WebP.
After you press Resize, the done row reads Saved <filename>. The filename is the original name when Overwrite files is ticked, or the original name with (resized) appended when it is not, with the extension matching the output format.
In your Library, the run appears under Image Resize with the filename as its label and a cost of zero. The saved entry keeps the resized image plus four figures: Dimensions, Format, Size and Smaller by (or Larger by) as a percentage. Very large results store a reduced preview instead of the full image and say so: Preview shown at reduced size; the full-resolution file was too large to keep. The downloaded file on your machine is always the full-resolution one. See Saved Work.
Examples#
Example: You have a 4.1 MB, 3024 × 4032 phone photograph for a blog post whose content column is 900 pixels wide. You drop it in, click Crop, choose 4:5, drag the selection over the subject and click Apply crop. You leave the unit on Pixels, type 900 into Width, and leave the fit on Fit so the height follows the shape. The Size readout shows 900 × 1125. New size settles at 284 KB and the savings bar reads 93% smaller. You tick Remove metadata that doesn't affect rendering to drop the GPS coordinates, untick Overwrite files so the original is kept, and press Resize. The panel reads Saved photo (resized).jpg.
Screenshots#
.jpg with the Resize another button)
Tips#
- Resize to the width your page actually renders, not the width of your screen. Image Support will tell you which images are oversized.
- Use
Fitunless you specifically need a fixed shape; it is the only mode that never distorts or crops. - Tick Make pictures smaller but not larger when processing a mixed batch, so the small files in it are left alone.
- Crop before you set the size. The crop changes the shape the fit mode works against.
- Untick Overwrite files while you are experimenting so you keep the original.
Best Practices#
- Strip metadata on anything published publicly, especially photographs taken on a phone.
- Keep a full-resolution master somewhere else; this tool downloads a new file and does not archive the original for you.
- Standardise on two or three sizes across a site rather than resizing each image to a unique width.
- For format changes and compression at the original size, use Image Reformat instead of resizing to the same dimensions.
Common Mistakes#
- Resizing to your screen width. The number that matters is the width the image is rendered at in your page template, which is usually much smaller.
- Using
Stretchto force a shape. It distorts the picture. Use Crop to choose what is kept, thenFit. - Expecting the format to change. Resizing keeps the source format. A PNG stays a PNG, however small you make it.
- Assuming "Overwrite files" replaces the original. It only controls the downloaded filename; nothing on your machine or your site is touched.
- Leaving metadata on published photographs. Phone photos carry GPS coordinates until you tick the box that removes them.
- Resizing an animated GIF. Only the first frame survives.
Limitations#
- Maximum input file size is 30 MB, and maximum output is 12,000 pixels on either axis.
- Output format follows the source and cannot be changed here.
- Animated GIFs are flattened to a single still frame.
- One image at a time; there is no batch queue.
- Overwrite files only names the download; it does not replace anything on your machine or on your website.
- The saved Library preview may be reduced for very large images, though the downloaded file is not.
- Nothing here uploads to your site — publishing is a separate step. See Publish Integrations.
Troubleshooting#
| Symptom | Likely cause | Fix |
|---|---|---|
That file is not an image. | The file is a PDF, SVG or another non-raster type | Convert it to PNG or JPEG first |
That image is larger than 30 MB. | Over the input cap | Reduce it in another tool first, or export a smaller version from the camera or design app |
That image could not be read. | The file is corrupt or uses an encoding the browser cannot decode | Re-export the image and try again |
This image could not be converted to that format. | The browser could not encode at these settings | Try a smaller output size |
That image could not be encoded. | Encoding did not finish before the download was requested | Wait for the New size figure to settle, then press Resize again |
| New size is larger than Original | You are upscaling, or the source was already efficiently compressed | Tick Make pictures smaller but not larger, or reduce the dimensions |
| The picture looks distorted | Fit mode is Stretch | Switch to Fit |
| Part of the picture is missing | Fit mode is Fill, which crops the overflow | Switch to Fit, or use Crop to choose what is kept |
| The metadata checkbox is greyed out | The output is WebP, which cannot carry EXIF | Expected. Metadata is always removed for WebP |
| The run is not in my Library | The background save failed silently | The download still succeeded. Re-run if you need the record |
FAQs#
Is my image uploaded anywhere? No. The resizing happens in your browser using the local file. Only a small record of the run — the filename, dimensions, format, size and a preview — is saved to your Library so the work appears in your history.
Does this cost credits? No. It is free on every plan, including Free, and it does not count toward your monthly allowance or the hourly fair-use limit.
Can I change a PNG to a JPEG here? No. Image Resize keeps the source format. Use Image Reformat for format conversion and quality compression.
What does "Ignore the orientation of pictures" actually do? When it is on, your width and height are used exactly as typed. When it is off and the image's orientation does not match the box's — a portrait photo with a landscape box — the box is swapped so the picture is not needlessly cropped or letterboxed.
Why is my resized PNG barely smaller? PNG is lossless, so reducing pixel count is the only saving available and the format's overhead can offset it. Converting the same file to WebP in Image Reformat usually saves far more.
Can I resize several images at once? Not currently. The tool handles one file at a time; Resize another clears it for the next.
See also
Was this article helpful?
Thanks — feedback noted for the docs team.