Guide
Building animated WebP images from a series of pictures
Animated WebP does everything a GIF does with better colors, real transparency and smaller files. Every current browser plays it, and most messaging apps accept it. This maker turns a set of pictures, photos or drawings, into one animated WebP with the size, timing and looping you choose.
Collecting the frames
Drop the images in any common format, including iPhone HEIC and AVIF. They appear in a list; drag them into the order they should play. Each image is one frame. For a smooth result, frames should share framing and lighting, like a burst of photos from a tripod or exported frames from an animation tool.
Size and framing
Pick a width between 320 and 1080 pixels; the height follows the shape of the first image. When images have different shapes, “Fit” shows each whole picture with background around it, and “Fill” crops each one to fill the frame. For web use, a width of 480 to 640 pixels is usually plenty and keeps the file light.
Timing and looping
The time per frame applies to every frame, from 20 milliseconds for fast motion to three seconds for slideshows. Around 80 to 150 milliseconds gives fluid stop-motion; 500 milliseconds to a second suits before-and-after sequences. Choose “Loop forever” for web animations and stickers, or “Play once” for an animation that should end on its last frame.
Transparency
With “Transparent background” on, empty areas stay transparent, including soft partial transparency along anti-aliased edges. This is the key advantage over GIF for stickers and overlays. With it off, the background color you pick fills empty areas.
Quality
The default of 85 percent balances size and detail well. Raise it for graphics with sharp text; lower it for photographic slideshows where smaller files matter more. The preview canvas shows the animation before encoding, and the finished WebP replaces the preview so you see the exact result.
What affects the file size
Every frame is stored as a complete WebP picture, so the size grows roughly with the number of frames times the pixels per frame. Twenty frames at 480 pixels wide usually fit in well under a megabyte, while the same frames at 1080 pixels can be four to five times larger. Busy photographic frames compress less well than flat illustrations. If the result is too heavy, reduce the width first, then the number of frames, and only then the quality.
Tips for clean frames
Export drawings at the same canvas size so nothing jumps between frames. For photos, lock the exposure and white balance on the camera if you can, since flickering brightness is the most common flaw in photo animations. Name files with numbers, such as frame-01 and frame-02, so they arrive in order and need little rearranging.
Browser support
All current browsers display animated WebP. Creating one needs a browser that can encode WebP: Chrome, Edge or Firefox. Safari cannot encode WebP, and the page tells you so instead of producing an invalid file.
When GIF is still the better choice
If the animation is going into an email newsletter or to someone using very old software, make a GIF with GIF Maker instead. To convert an existing GIF to WebP, use GIF to WebP; to go from WebP back to GIF, WebP to GIF.
Ideas
Product rotations from a series of photos, a short tutorial from screenshots, a looping logo reveal, a stop-motion clip from a phone burst, or a transparent animated emoji from hand-drawn PNG frames.
Checked against the current version of the Animated WebP Maker on .