Resizing should be fast, predictable, and high-quality. Use these field-tested tips to get clean results for web, social, email, and print.
1) Start with the destination
Before typing numbers, decide where the image will live—that determines units, format, and quality.
- Website / App UI → work in pixels; export JPEG/WebP; control file size for speed.
- Social avatars & cards → use exact platform aspect ratios; prepare @2x for Retina.
- Email → keep width ≤ 1200 px and moderate quality so total < 1 MB.
- Print → switch to in / cm / mm and set DPI (typically 300); see §3.
2) Lock aspect ratio to avoid distortion
- Turn on Lock Aspect Ratio. Type either width or height; let the tool compute the other side.
- If you must hit an exact box (e.g., 1200×630) but your photo doesn’t match, resize first, then crop (don’t stretch).
Quick rule: If faces look “wide” or logos look “tall,” you probably broke aspect ratio—undo and lock it again.
3) Print sizing without guesswork
Use physical units with DPI:
- 4×6 in at 300 DPI → 1200×1800 px
- 8×10 in at 300 DPI → 2400×3000 px
Tips:
- For posters you view from farther away, 200–240 DPI is often fine.
- Keep text/logos as vectors when possible; if raster, prefer PNG/TIFF to avoid artifacts.
4) Choose the right format (simple cheatsheet)
- JPEG/JPG: photos; smallest size with a quality slider.
- PNG: transparency (logos, UI), or sharp edges/line art.
- WebP: great balance of quality + size for web (photos or graphics).
- GIF: only if you need animation; otherwise avoid (big and limited colors).
5) Compression & quality that still looks great
- Start around 80–85% JPEG quality for web photos; drop to 70–75% if you must hit small sizes.
- Prefer WebP for further savings at similar visual quality.
- When downscaling, you can lower quality more aggressively without visible loss.
- When upscaling, be conservative (≤2×); heavy upscales amplify noise—consider re-exporting from source or using dedicated upscalers.
6) Retina/@2x assets without confusion
- If a slot is 400×300 px, export 800×600 px and name it
[email protected]. - In CSS/HTML, display at the logical size (400×300). This keeps UI crisp on high-DPI screens.
7) Workflow that saves time
- Upload the highest-quality source you have.
- Pick units (px for web; in/cm/mm for print) and lock aspect.
- Type one side; watch the real-time preview to confirm framing and sharpness.
- Pick format + quality (JPEG/WebP for photos; PNG for transparency).
- Download, then quickly check on a real device (phone + laptop).
8) Common problems → fast fixes
- Looks soft after resize → downscale less or sharpen in editor; avoid heavy upscales.
- Edges/fringing around logo → switch to PNG, not JPEG.
- File too big → try WebP or lower JPEG quality; ensure dimensions aren’t overkill.
- Email blocked by size → cap width ~1200 px; JPEG quality 70–75%.
- Print came out tiny → you resized in pixels without setting DPI; redo with inches/cm + 300 DPI.
9) Handy starting points (tweak as needed)
- Blog/marketing inline: 1200 px width, JPEG/WebP q≈80.
- Hero/cover: 1600–1920 px width, JPEG/WebP q≈80.
- Thumbnails: 320–640 px square, JPEG/WebP q≈75（PNG for icons/logos）.
- Print 8×10 in: 300 DPI → 2400×3000 px, PNG/TIFF for graphics, high-quality JPEG for photos.
Why this tool works well for the above
- Pick pixels / inches / cm / mm, set DPI, lock aspect, and adjust quality with real-time preview before download.
- Supports JPG, PNG, GIF, WebP and private, on-device processing (no uploads). :contentReference[oaicite:0]{index=0}