ReallyUseful.Tools

HTML5 to GIF

Convert HTML5 banner ads to animated GIFs. Upload a ZIP from Google Web Designer, Adobe Animate, or GSAP, set frame rate, size, and quality, and fit 150 KB ad limits.

Preparing this page for offline use…

Drop an HTML5 ad here (ZIP, folder, or HTML file), or click to upload

Google Web Designer, Adobe Animate, GSAP, CSS animations, Canvas, SVG, and hand-coded banners. Nothing is uploaded.

How to use HTML5 to GIF

Convert an HTML5 banner ad into an animated GIF. Drop in the ZIP you'd upload to an ad server — from Google Web Designer, Adobe Animate, or hand-written HTML, CSS, and GSAP — and get a GIF plus a backup image, ready for networks and email that don't run HTML5.

How to convert an HTML5 ad to GIF

  1. Drop the ad's ZIP, its folder, or its index.html (or paste the code)
  2. The size is read from the ad's ad.size meta tag, and the length is found by watching when the animation stops (or one loop, for ads that loop)
  3. Pick a frame rate, scale, and background, then press Create GIF
  4. Tune colors, dithering, lossy compression, and loops — the GIF updates without capturing again
  5. Download the GIF, a still backup image, the frames, or an MP4

Frame-perfect capture

The ad runs on a paused clock. Each frame is rendered at exactly the right moment, then time moves forward by one frame, so the GIF never stutters or drops frames, even on a slow computer. This covers CSS animations and transitions, the Web Animations API, GSAP and TweenMax, Adobe Animate (CreateJS) canvas, SVG animation, video, and plain JavaScript timers and requestAnimationFrame. For WebGL, embedded iframes, web components with shadow DOM, or anything else the renderer can't draw, switch to Screen capture, which records the ad in real time as your browser shows it.

Built for ad specs

  • Google Ads check: 150 KB or less, animation that stops within 30 seconds, and slower than 5 frames per second
  • Fit to file limit finds the lightest compression that gets under 150 KB, 200 KB, or any size you set
  • Set the loop count so the total play time stays inside the limit, and hold the end frame longer
  • Pick any frame as the backup image (JPG, PNG, GIF, or WebP) and see its file size
  • A ZIP with several ad sizes? Convert them all at once and get every GIF and backup image in one ZIP

Private

Your ad's files are opened on your device and served to the preview from your browser's own storage, which is cleared when you load another ad or close the page. Nothing is uploaded. Fonts and images the ad loads from other sites need an internet connection and must allow cross-origin access to appear in frame-by-frame capture.

Already have a GIF or video? Use the GIF compressor or video to GIF, or open your result in the GIF editor to crop, add text, or change the speed.

HTML5 to GIF FAQs

How do I convert an HTML5 banner to a GIF?

Drop the ad's ZIP (the one you'd upload to an ad server), its folder, or its index.html. The tool reads the size, finds how long the animation lasts, and captures it frame by frame. Choose the frame rate and quality, press Create GIF, and download it.

Does it work with Google Web Designer and Adobe Animate?

Yes. Google Web Designer ads, Adobe Animate HTML5 Canvas (CreateJS) exports, GSAP and TweenMax banners, CSS-animated ads, and SVG animations all work. Ads that need Google's Enabler script load it from the internet as usual.

Why doesn't my GIF stutter even on a slow computer?

In frame-by-frame mode the ad's clock is paused. Each frame is rendered at its exact time, however long that takes, and then the clock moves forward exactly one frame. The result is the same on any device.

How do I get my GIF under 150 KB for Google Ads?

Choose Google Ads under Ad specs and press Fit to file limit. The tool tries fewer colors, lossy compression, and, if needed, fewer frames until the GIF fits. Lower frame rates, shorter animations, and flat backgrounds also help.

What are Google Ads' rules for animated GIFs?

Google Ads accepts animated GIFs up to 150 KB. The animation can loop but must stop within 30 seconds, and it must run slower than 5 frames per second. Press Apply platform settings to set a matching frame rate and loop count, and check Google's current specs before you upload.

Can I make a backup image too?

Yes. After creating the GIF, drag the backup image slider to any frame (the last frame is picked by default) and download it as JPG, PNG, GIF, or WebP. Its file size is shown so you can check it against your ad server's limit.

Is my ad uploaded anywhere?

No. The ZIP is unpacked in your browser and the preview is served from your browser's own storage. Rendering and GIF encoding happen on your device.

Some images or fonts are missing from my GIF. Why?

Images and fonts loaded from other websites can only be drawn in frame-by-frame mode if that site allows cross-origin access. Embedded iframes, web components that use shadow DOM, and WebGL can't be drawn either. For those, switch the capture method to Screen capture, which records exactly what your browser shows.

More Image Tools

Browse all 57 Image Tools tools