About this tool
Resizing means changing the pixel dimensions of an image - not the file size, not the print size, the raw pixel grid. A 4000x3000 photo from a phone has 12 megapixels of detail. Most websites display hero images at 1600px wide; resizing the source to that size before serving cuts the page weight by ~60% with no perceptible quality loss.
This tool resizes in your browser using the HTML Canvas API. You can set an exact width and height, scale by percentage, or lock aspect ratio so width and height update together. Downscaling is high-quality (browser-default imageSmoothingQuality: high); upscaling beyond ~150% will look soft because the source has no extra detail to invent. For aggressive upscaling use a dedicated upscaler that runs an AI model.
How it works
Open your image
Drop or pick a JPG, PNG, WebP, or GIF. The tool reads the file locally and shows the current pixel dimensions.
Set the target size
Type a target width or height in pixels. With "Lock aspect ratio" on, the other dimension updates automatically to keep the image undistorted.
Resize by percentage if you prefer
Set a percentage (50 = half-size, 25 = quarter-size). Useful for batch-style web optimization where you want a consistent reduction.
Download
The resized image saves to your device. PNG keeps transparency; JPG / WebP get re-encoded at near-default quality.
Use cases
Web performance
Hero images at 1600-2000px wide cover even retina displays. Phones rarely need more than 1200px wide. Resizing the source before upload is cheaper than runtime image processing on the server.
Email attachments
Most email providers cap attachments at 25 MB. A handful of 12 MP photos easily breaches that. Resizing to 2000px wide drops each photo to under 1 MB.
Forum and chat avatars
Discord, Slack, Reddit, and many forums cap avatars at specific dimensions (Discord 128px, Slack 512px). Pre-resize to avoid auto-crop surprises.
PowerPoint / Google Slides
Slides are typically 1920x1080. Resizing photos to ~1500px wide keeps the deck small while staying sharp on a projector.
Reducing photo library size
A folder of 1000 phone photos at 12MP each is ~5 GB. Resized to 2400px wide it is ~600 MB while still printable up to 8x10".
Format and spec details
| Common web sizes | Hero 1600-2000px, Article 1200px, Thumbnail 400-600px, Avatar 128-512px |
|---|---|
| Common print sizes (300 DPI) | 4x6 = 1200x1800, 5x7 = 1500x2100, 8x10 = 2400x3000, A4 = 2480x3508 |
| iPhone screenshot | 1170x2532 (iPhone 15 Pro Max base) |
| Output formats | PNG (lossless), JPG (lossy), WebP (modern, smaller), GIF (palette-limited) |
Tips and best practices
- Web rule of thumb: serve images at ~2x their displayed size for retina, then let the browser scale down.
- Use WebP where you can - typically 25-35% smaller than JPG at equivalent quality.
- For social posts, resize to the platform's recommended size before upload. Auto-resizing on upload can soften your image.
- Print? Multiply printed inches by 300 (DPI) to get pixel dimensions. A 4x6 print at 300 DPI = 1200x1800 px.
- Keep the original. Resizing is destructive - the discarded pixels are gone.
Why convert images to PNG
PNG is the right choice when you need lossless quality, transparency (alpha channel), or sharp lines that JPG smears - logos, screenshots, UI mockups, diagrams. PNG files are larger than JPG but the quality is pixel-perfect.
Image format comparison
| Format | Compression | Transparency | Animation | Color depth | Browser support |
|---|---|---|---|---|---|
| JPG / JPEG | Lossy | No | No | 8-bit | Universal (since 1992) |
| PNG | Lossless | Yes (alpha) | No (APNG ext.) | 8/16-bit + alpha | Universal (since 1996) |
| WebP | Both | Yes | Yes | 8-bit + alpha | All modern (96% global) |
| AVIF | Lossy (AV1) | Yes | Yes | 10/12-bit HDR | Chrome, Firefox, Safari 16+ |
| GIF | Lossless palette | 1-bit | Yes | 256 colors | Universal |
| HEIC / HEIF | Lossy (HEVC) | Yes | Yes | 10-bit HDR | iOS, macOS, Win10+ |
File size comparison (same 1920x1080 photo)
WebP is ~40% smaller than JPG for the same visible quality. AVIF is ~60% smaller, but still has slower encoders and limited compatibility with older Windows tools.
When NOT to convert
- To JPG, if you have transparency: JPG drops alpha. The transparent pixels render as your chosen background colour.
- To JPG repeatedly: every save loses quality (generation loss). Re-edit from the original whenever possible.
- To PNG, if you need small files: PNG can be 5-10x larger than JPG. Use only when transparency or lossless quality is required.
- To WebP, if your audience is on very old systems: IE11 and pre-2020 email clients (Outlook 2019, etc.) don't render WebP.
How browser-based conversion works
This tool uses the HTML5 Canvas API. When you drop a file:
- FileReader reads the image into a binary blob that stays in your browser memory.
- An <img> element decodes the blob to a bitmap.
- A <canvas> of matching dimensions is created, and the bitmap is drawn onto it.
- canvas.toBlob() re-encodes the bitmap to your target format at your chosen quality.
- URL.createObjectURL produces a download link to that blob.
The original file never uploads anywhere - all of the above happens in your tab. The encoded output exists only in your browser until you download it.
Quality settings demystified
JPG and WebP quality is a 0-100 scale. It's not linear - quality 85 keeps ~95% of perceived detail at ~25% of the file size compared to quality 100. The sweet spot for photos is quality 80-85. Drop to 70-75 for thumbnails, raise to 95+ for archival masters.
Privacy and offline operation
Every operation in this tool runs client-side using your browser's built-in APIs (Canvas, Web Audio, WebAssembly). No data is uploaded. After the initial page load you can disconnect from the internet and the tool keeps working.
We use Google Analytics and AdSense for the page itself, but neither sees the content of the files you process.
Frequently asked questions
Will resizing reduce my image quality?
Downscaling is essentially lossless visually - you remove detail you would not see at the new size anyway. Upscaling is lossy because the browser has to invent pixels; for >150% upscale use Image Upscale (AI-based).
Does resizing change the file size?
Always. Half the dimensions = roughly a quarter of the file size for raster formats. PNG to JPG conversion alone can drop file size 70-90% on photographic content.
What is the difference between resize and resample?
Casual usage treats them as synonyms. Strictly: resize changes the canvas; resample changes the pixel count. This tool resamples (changes pixel count) and matches it to the canvas - which is what most people mean by "resize".
Should I lock the aspect ratio?
Almost always yes. Stretching only one dimension distorts faces and text. Unlock only when you are intentionally distorting to fit a specific frame (rare).
How do I resize without losing transparency?
Keep the output as PNG or WebP. JPG has no transparency and will fill it with white.
Are uploaded images sent to a server?
No. All conversion happens in your browser using the Canvas API. The file never leaves your device. You can disconnect from the internet after the page loads and the tool still works.
Will the converted file have the same dimensions?
Yes by default. The canvas is sized to match the source image's intrinsic width and height. EXIF orientation is automatically applied so phone photos won't appear rotated.
What happens to EXIF and metadata?
Most converters (including this one) strip EXIF on re-encode for privacy. GPS coordinates, camera serial number, and timestamps are all removed unless explicitly preserved by an option.
Can I convert in bulk?
Yes - drop multiple files at once. Each is converted independently and produces its own download link. Large batches may slow your browser; convert 20-50 at a time.
Why is my converted file larger than the original?
Usually because the original used a more efficient algorithm. Converting a JPG to PNG always makes the file larger (PNG is lossless). Converting an AVIF to JPG also typically grows the file.
Does HEIC work in this browser?
Safari 13+ and Chrome 119+ (with flag) decode HEIC natively. Other browsers fall back to JavaScript decoders that work but are slower. The tool will tell you if your browser cannot read your file.
What's the best image format for 2026?
Depends on the use case. For new web content: WebP for most images, AVIF if you can serve format negotiation, PNG for transparency, SVG for vectors. JPG remains the safe universal fallback. Phone screenshots: PNG or WebP lossless.
Does converting reduce quality?
Lossy-to-lossy (JPG to WebP) introduces a small additional loss. Lossless-to-lossy (PNG to JPG) introduces visible loss but smaller files. Lossless-to-lossless (PNG to WebP lossless) is pixel-perfect.
Why does PNG support vary by browser?
Different browsers adopted different formats at different times. WebP: universal as of 2020. AVIF: Chrome 85+, Firefox 93+, Safari 16+. HEIC: native to iOS/macOS, limited elsewhere. Modern best practice is multi-format
Should I use AVIF for everything?
Not yet. AVIF is ~30% smaller than WebP at the same quality but takes 10-100x longer to encode and isn't supported in older browsers. Use AVIF for hero images where bandwidth matters; WebP everywhere else.
How do I batch-convert hundreds of images?
This tool processes one at a time in the browser. For large batches, use desktop tools: ImageMagick (cross-platform CLI), Squoosh CLI (per-file), or build-time pipelines like sharp (Node), Pillow (Python), or imgix/Cloudinary (managed).
Are my images uploaded to a server when I convert here?
No. All conversion happens in your browser using the HTML5 Canvas API. The image stays in your tab's memory; nothing is sent. Verify by opening browser DevTools, Network tab - no upload requests fire.