Image Resizer Online
Resize images to exact dimensions for any use caseβsocial media, websites, email, print, or any specific size requirement. This free online tool lets you scale images up or down while maintaining quality and offers both exact pixel dimensions and percentage-based scaling.
Understanding Image Resizing
Resizing changes the pixel dimensions of an image. Downscaling (making smaller) generally maintains quality well because existing pixels are sampled. Upscaling (making larger) can reduce quality because new pixels must be interpolated from existing ones. For best results, always start with the largest available original and resize down.
Social Media Image Sizes
| Platform | Post Type | Dimensions | Aspect Ratio |
|---|---|---|---|
| Feed post | 1200 x 630 | 1.91:1 | |
| Story | 1080 x 1920 | 9:16 | |
| Square | 1080 x 1080 | 1:1 | |
| Portrait | 1080 x 1350 | 4:5 | |
| Landscape | 1080 x 566 | 1.91:1 | |
| Story/Reel | 1080 x 1920 | 9:16 | |
| Twitter/X | In-stream | 1200 x 675 | 16:9 |
| Post | 1200 x 627 | 1.91:1 | |
| Pin | 1000 x 1500 | 2:3 | |
| YouTube | Thumbnail | 1280 x 720 | 16:9 |
Website Image Sizes
| Use Case | Recommended Width | Notes |
|---|---|---|
| Hero/Banner | 1920px | Full-width, above fold |
| Blog content | 800-1200px | Within article body |
| Sidebar | 300-400px | Sidebars, widgets |
| Thumbnails | 300-400px | Galleries, cards |
| Product images | 800-1200px | E-commerce detail |
| Avatars | 100-200px | User profiles |
| OG images | 1200 x 630 | Social sharing |
Retina/HiDPI Considerations
Modern devices have high pixel density displays (2x, 3x). To appear sharp:
| Display Size | @1x | @2x (Retina) | @3x |
|---|---|---|---|
| 100px display | 100px | 200px | 300px |
| 400px display | 400px | 800px | 1200px |
| 800px display | 800px | 1600px | 2400px |
css
img {
width: 400px;
height: auto;
}
`Aspect Ratio Guide
| Ratio | Common Uses | Example Sizes |
|---|---|---|
| 1:1 | Instagram, avatars | 1080x1080, 500x500 |
| 4:3 | Traditional photos | 1200x900, 800x600 |
| 3:2 | DSLR photos | 1200x800, 900x600 |
| 16:9 | YouTube, HD video | 1920x1080, 1280x720 |
| 9:16 | Stories, vertical video | 1080x1920 |
| 2:3 | Pinterest pins | 1000x1500 |
Quality Preservation Tips
1. Always resize down, not up - Start with the largest original
2. Resize before compression - Reduces pixel count first, then compress
3. Maintain aspect ratio - Avoid stretching or squishing
4. Use appropriate algorithm - Lanczos for photos, nearest-neighbor for pixel art
5. Save in correct format - JPEG for photos, PNG for graphics
Use this resizer to prepare images for any platform or use case with precise dimension control.
Sizing Before Compressing
Resizing beats compressing. Halving an image's dimensions removes 75% of its pixels, which
no quality setting can match, and a 4000px photo displayed at 800px is wasting 96% of what
it downloads.
| Displayed at | Serve (1Γ) | Serve (2Γ for retina) |
|---|---|---|
| 400px | 400px | 800px |
| 800px | 800px | 1600px |
| 1200px | 1200px | 2400px |
Above 2Γ there is no visible benefit on any current display, and the file size keeps rising.Quality Settings That Hold Up
| Setting | Looks | Use for |
|---|---|---|
| 95β100 | Indistinguishable, large | Masters and print |
| 80β90 | Very good | Hero images, product photography |
| 70β80 | Good | Most web content |
| 50β70 | Visible artefacts on detail | Thumbnails |
| Below 50 | Obvious | Nothing |
Around 75β85 is where the curve bends: below it quality falls quickly, above it file size
rises quickly for no visible gain.Everything Runs Locally
Conversion and compression here use a canvas in your own tab. No file is uploaded, nothing
is stored, and the work continues offline once the page has loaded. That is worth knowing
for anything containing faces, documents or unreleased work β most online image tools upload
by necessity, because they process server-side.
Getting the Rest of the Win
Serve modern formats with a fallback.with AVIF, then WebP, then JPG.Always setwidthandheight.Without them the page reflows on load, which
Google measures as Cumulative Layout Shift.
Lazy-load below the fold β and never the hero, sinceloading="lazy"` on it delays
- Strip metadata. EXIF can carry GPS coordinates and adds weight to every copy.