How is this different from gif-shrinker?

gif-shrinker resizes the entire canvas down (the output GIF becomes physically smaller). This tool keeps the canvas at its original size and instead shrinks the content within it, padding the newly exposed border with transparency, so the output dimensions never change.

What does the unzoom percentage control?

It sets how much smaller the content becomes relative to the canvas: 100% leaves it unchanged, while higher values (up to 1000%) shrink the content further toward the center, leaving a progressively wider transparent border.

Is this literally the inverse of gif-zoomer?

Conceptually yes: gif-zoomer crops and magnifies to fill the frame; this tool shrinks and pads to leave empty space, restoring a wider apparent view. They aren't a perfect mathematical inverse of each other on arbitrary GIFs, since zooming discards outer pixel data that unzooming can't recover.

Why would newly exposed area be transparent rather than a solid color?

Transparency keeps the tool usable regardless of what background the resulting GIF is placed on; if you need a solid-colored border instead, composite the result over a background afterward.

GIF Unzoomer - Zoom Out an Animated GIF's Content

Overview

Introduction

Sometimes content that fills an animated GIF edge-to-edge needs to look further away or smaller within the same frame, the opposite of a zoom-in effect. This tool shrinks every frame's content and pads it back onto the original canvas size.

It decodes each frame, shrinks and centers its content, and re-encodes a new animated GIF at the same original dimensions, entirely in your browser.

What Is GIF Unzoomer?

A client-side tool that shrinks the content of every frame of an animated GIF by a chosen "unzoom" percentage and centers it on a transparent canvas matching the source's original width and height, effectively restoring a wider, zoomed-out view.

It's the letterboxing counterpart to gif-zoomer's crop-and-magnify approach: instead of cropping in and enlarging, it shrinks down and pads out.

How GIF Unzoomer Works

For a given unzoom percentage, the tool computes a smaller content size (the original width/height divided by the zoom factor) and nearest-neighbor resamples the frame down to that size.

That shrunk content is then centered on a newly created transparent canvas matching the source's original dimensions. This runs identically per decoded frame, keeping every re-encoded frame the same canvas size.

When To Use GIF Unzoomer

Use it when an animated subject looks too zoomed-in or cramped within its frame and you want to pull back to show more surrounding space.

It's also useful as a quick way to add a uniform transparent border/margin around an animation's content without cropping anything away.

Often used alongside GIF Zoomer, GIF Canvas Size Changer and GIF Rectangle Fitter.

Features

Advantages

Keeps the output canvas at the exact same size as the source, so it drops into the same layout space.
Applies the same shrink-and-center treatment consistently across every frame.
Runs entirely client-side; nothing you upload leaves your browser.

Limitations

Can't recover detail from outside the original frame's edges; it only rearranges what was already captured within the source canvas.
At high unzoom percentages, the shrunk content can become quite small relative to the growing transparent border, which may look sparse.

Examples

Pulling back from a full-frame subject at 200%

Input

A 400x300 animated GIF whose subject fills the entire frame, unzoomPercent = 200

Output

A 400x300 animated GIF where the subject now occupies a centered 200x150 region, surrounded by a transparent border

At 200% unzoom, the content is shrunk to half its original width and height and centered on a transparent canvas matching the source's original 400x300 size.

Best Practices & Notes

Best Practices

Start with a modest unzoom percentage (150-200%) and preview before going further; very high values leave mostly empty space.
If you plan to place the result over a colored background, remember the padded area is transparent, not white or black.
Combine with gif-canvas-size-changer afterward if you'd rather trim the transparent border down to a smaller final canvas.

Developer Notes

unzoomGif in gif-unzoomer.ts computes the inverse scale factor of zoomGif (100 / unzoomPercent instead of zoomPercent / 100), resamples down with resizeNearest, then centers the result on a fresh transparent canvas matching the source's original per-frame dimensions, mirroring the centering math changePngCanvasSize uses for its "center" anchor. Run per decoded GIF frame via transformGifFrames.

GIF Unzoomer Use Cases

Pulling back visually from a subject that fills an animated frame edge-to-edge
Adding a uniform transparent margin around an animation's content without cropping
Correcting a GIF that was previously zoomed in too aggressively

Common Mistakes

Expecting this to recover pixel detail from outside the original frame; it can only rearrange content that was already captured.
Using a very high unzoom percentage and being surprised the subject becomes tiny relative to the padded canvas.

Tips

If you want a smaller final file rather than padding, gif-shrinker (which resizes the whole canvas down) may suit your goal better.
Pair with gif-zoomer during testing: zoom in, then unzoom by a comparable amount, to see how close you get back to a wider view.

GIF Unzoomer