Web Image Optimizer
Turn one image into a ready-to-use responsive pack: WebP/AVIF at multiple widths, srcset & picture HTML, one ZIP download.
Drop an image here
or browse files
Supports: JPG, PNG, WebP, GIF (first frame), BMP, AVIF, HEIC
Ctrl + V Paste from clipboard
Format
Dimensions
File size
Assets
Animated input detected — the first frame will be used for the responsive pack.
Web Image Pack
| File | Dimensions | Format | Size | vs original | |
|---|---|---|---|---|---|
ZIP contains all assets, picture.html and a README with placement advice.
Ready-to-use HTML
picture — AVIF → WebP fallback chain (best compression)
img + srcset — single-format version (WebP only)
Pack Settings
Widths larger than the original are disabled.
Used to build the sizes attribute: (max-width: Npx) 100vw, Npx
🔒This image stays on your device.
⚡Tip: keep 2× your largest layout width for retina screens.
ImageTiny
Compress + batchNeed faster photo compression on iPhone?
ImageTiny handles on-device compression, crop, resize, format conversion, and EXIF cleanup, with batch processing for up to 200 photos.
Best for common iPhone photo workflows like HEIC, JPG, PNG, and WebP.
أدوات ذات صلة
One upload, a complete responsive image set
Browsers pick the smallest file they can render. This tool produces the whole set for you — no server, no upload, no guessing filenames by hand.
Multiple widths
480 / 768 / 1280 / 1920 px versions (auto-clamped to your original), encoded as WebP, optionally AVIF.
HTML that works
A <picture> block with AVIF → WebP fallback sources, and a plain img[srcset] alternative. Filenames match the generated assets exactly.
One ZIP download
Every asset plus picture.html and a README with placement advice — drop it into your site and go.
How the HTML works
<picture>
<source type="image/avif" srcset="photo-480w.avif 480w, photo-1920w.avif 1920w">
<source type="image/webp" srcset="photo-480w.webp 480w, photo-1920w.webp 1920w">
<img src="photo-1920w.webp" alt="..." loading="lazy" decoding="async">
</picture>- The browser tries each <source> top to bottom and uses the first type it supports.
- Inside srcset, the "480w" descriptors describe each file's real pixel width — the browser then picks by viewport and device pixel ratio.
- sizes tells the browser how wide the image will render, so it downloads the smallest sufficient file.
Edge cases
- AVIF encoding is only available in some browsers (Chrome/Edge 121+). When unavailable, the AVIF option is disabled and the HTML omits the AVIF source.
- PNG transparency is preserved in WebP and AVIF outputs.
- Animated GIF/WebP inputs use the first frame — use the dedicated GIF tools for animations.
- Images narrower than 480px generate a single asset at the original width.
- HEIC/HEIF photos (iPhone default) are decoded locally in a worker and enter the pack like any other input.
آخر تحديث: 20 سبتمبر 2026