What this tool does
Image Resizer & Compressor lets you resize, compress, and convert images entirely in your browser. Upload any browser-supported image format (JPEG, PNG, WebP, GIF, BMP) and adjust its dimensions by entering exact pixel values or choosing a percentage scale. You can also convert between JPEG, PNG, and WebP output formats and fine-tune the compression quality for JPEG and WebP files. The tool displays the original and resized images side by side, along with file size statistics so you can see exactly how much space you saved. Because all processing happens locally using the HTML5 Canvas API, your images never leave your device and there is no upload limit or server dependency.
How it works
The tool uses the browser's built-in Canvas API to perform image manipulation. When you upload an image, it is loaded into an HTMLImageElement to read its native dimensions. A hidden canvas element is then sized to your target dimensions. The browser's 2D rendering context draws the source image onto the canvas at the new size, using bilinear interpolation for smooth downscaling. The canvas.toBlob() method encodes the result in your chosen output format (JPEG, PNG, or WebP) at the specified quality level. For JPEG and WebP, the quality parameter controls the compression ratio: lower values produce smaller files with more compression artifacts, while higher values preserve detail at the cost of larger file size. PNG output is always lossless, so the quality slider does not apply. The final image is made available as a downloadable blob URL.
Supported formats
**JPEG** is best for photographs and complex images with gradual color transitions. It uses lossy compression, meaning some image data is discarded to reduce file size. Quality settings between 70-85% typically offer a good balance between file size and visual fidelity. File sizes are generally the smallest of the three formats for photographic content.
**PNG** is ideal for images requiring transparency, screenshots, text overlays, logos, and graphics with sharp edges or flat colors. It uses lossless compression, so no image data is lost, but file sizes tend to be larger than JPEG for photographic images. The quality slider has no effect on PNG output since the format is always lossless.
**WebP** is a modern format developed by Google that supports both lossy and lossless compression. It typically produces files 25-35% smaller than equivalent JPEG images at similar visual quality. WebP also supports transparency (like PNG) with lossy compression (unlike PNG). It is supported in all modern browsers but may not be compatible with older image editing software.
Worked examples
**Example 1: Reducing a photo for email.** You have a 4000 x 3000 px JPEG photo from your camera at 4.2 MB. You set the scale to 50%, output format to JPEG, and quality to 75%. The result is a 2000 x 1500 px image at approximately 380 KB, a 91% reduction in file size suitable for email attachments.
**Example 2: Converting a PNG screenshot to WebP.** You have a 1920 x 1080 px PNG screenshot at 1.8 MB. You keep the dimensions at 100%, change the output format to WebP, and set quality to 85%. The result is a 1920 x 1080 px WebP image at approximately 210 KB, an 88% reduction while maintaining crisp text and UI elements.
**Example 3: Creating a thumbnail.** You have a 3200 x 2400 px product photo at 2.1 MB. You switch to dimension mode, enter 320 px width with aspect ratio locked, select JPEG at 80% quality. The result is a 320 x 240 px thumbnail at approximately 18 KB.
Limitations
All processing occurs in your browser's memory, which means very large images (above 50 megapixels or several hundred megabytes) may cause the browser tab to run out of memory or become unresponsive. The Canvas API does not preserve EXIF metadata such as camera settings, GPS location, or orientation tags from the original image. Color profile information (ICC profiles) may be lost or converted to sRGB during processing. Animated GIFs will be flattened to a single frame when resized. The tool cannot perform advanced editing operations like cropping, rotating, or applying filters. Upscaling an image beyond its original dimensions will not add detail and may produce blurry results, since the browser's bilinear interpolation simply stretches existing pixel data. JPEG and WebP artifacts become more visible at quality settings below 50%.
FAQs
Q: Does resizing an image reduce its quality? A: Downscaling (making an image smaller) generally looks good because the browser averages multiple source pixels into each output pixel. However, upscaling (making an image larger) stretches pixels and produces softer, blurrier results. For lossy formats like JPEG and WebP, each re-encoding cycle introduces small compression artifacts, so avoid repeatedly resizing and saving the same image.
Q: What quality setting should I use for JPEG? A: For most uses, 75-85% offers a strong balance between file size and visual quality. Below 60%, compression artifacts become noticeable in detailed areas. Above 90%, file size increases significantly with minimal perceptible improvement. For archival purposes, use PNG instead.
Q: Why is my PNG file larger than the original JPEG? A: PNG uses lossless compression, which preserves every pixel exactly. JPEG discards visual information to achieve smaller sizes. Converting a JPEG to PNG will almost always increase the file size because you are storing the same pixel data without any lossy compression. Convert to PNG only when you need transparency or exact pixel reproduction.
Q: Are my images uploaded to a server? A: No. All processing happens entirely in your browser using the Canvas API. Your images never leave your device, are not transmitted over the network, and are discarded when you close the tab or reset the tool.
Explore Similar Tools
Explore more tools like this one:
- Image Color Picker — Upload an image and pick specific pixel colors. Get Hex,... - Image Metadata Remover (EXIF Stripper) — Remove EXIF data, GPS coordinates, and other metadata... - Bulk Image Compressor — Compress multiple images at once with adjustable quality... - Image Alt Text Generator — Upload an image and generate SEO-friendly alt text... - Image Format Converter — Convert images between JPG, PNG, and WEBP formats instantly.