Can I turn the animation off later?

Yes. Delete the line from your HTML. The still favicon keeps working.

GIF to Favicon - Animated Favicon Generator That Works in Chrome

How to convert GIF to ICO

Add your GIF. Drop your GIF into the box, or browse for it. It is read on your device and never uploaded.
Pick the still frame. Every frame shows under the preview. The ticked one becomes favicon.ico and the PNGs - pick a frame that looks good on its own.
Keep Animated favicon on. Under Extra files, Animated favicon is on for animated GIFs. Add your site name and theme colour too.
Download the pack. Press Make my favicon. Upload the files and paste favicon-html.txt into your <head> - the script line makes it move.

Want to make the GIF first? The GIF Maker turns images into an animation.

An animated favicon that really plays

Browsers disagree on animated favicons: Firefox plays an animated GIF, but Chrome, Edge and Safari only show its first frame.

So the pack brings a tiny script (animated-favicon.js, under 1 KB) and a strip of 32 px frames. The script swaps the frames in the tab with your GIF timing - in every browser.

Still favicon first. favicon.ico and the PNGs use the frame you tick, so bookmarks, Windows and search results look right.
Polite. Visitors who turned on reduced motion get the still favicon.
Long GIF? Up to 100 frames are kept; longer GIFs are thinned out evenly with the same total timing.

What is in the favicon pack

File	Size	Used by
favicon.ico	16, 32, 48 px	Every browser, bookmarks, Windows shortcuts
favicon-16x16.png, favicon-32x32.png	16 and 32 px	Browser tabs in modern browsers
favicon-96x96.png	96 px	Google search results, desktop shortcuts
apple-touch-icon.png	180 px	iPhone and iPad home screen
android-chrome-192x192.png, -512x512.png	192 and 512 px	Android home screen, PWA install
site.webmanifest	-	Android and PWAs: name, icons, theme colour
favicon-animated.gif, favicon-frames.png, animated-favicon.js	32 px	The animation - every browser tab
favicon-html.txt	-	The lines to paste into your <head>

Only need the classic file? Pick the favicon.ico only preset. Every ZIP also has a README.

How to add the favicon to your website

Unzip the pack and upload every file to the root folder of your site, next to your home page.
Open favicon-html.txt and paste its lines into the <head> of your pages.
Hard-refresh the page (Ctrl+F5) - browsers keep old favicons for a long time.

Using WordPress? Go to Appearance, Customize, Site Identity and upload the 512 px PNG as the Site Icon. Then check your live site with the Favicon Checker.

Tips for animated favicons

Keep it simple. 32 px is tiny - a bounce, blink or spin reads better than a busy scene.
Use it for a reason. A moving tab grabs attention - great for a live stream, a sale or a chat badge, tiring all day long.
Need just a few frames? Trim the GIF first with the GIF Frame Extractor or slow it down with Compress GIF.

Frequently Asked Questions

Drop your GIF into the box, keep Animated favicon on and press Make my favicon.

Upload the files from the ZIP and paste favicon-html.txt into your <head>. The script line makes the tab icon move.

Not with a GIF alone - Chrome shows only the first frame. That is why the pack includes animated-favicon.js: it plays the frames in Chrome, Edge, Firefox and Safari.

The one you tick under the preview - frame 1 by default. favicon.ico, the PNGs and the Apple and Android icons all use it.

No. The script is under 1 KB, starts after the page loads and uses one small image. It stops for visitors who prefer reduced motion.

Yes. Delete the <script> line from your HTML. The still favicon keeps working.

Yes. Transparent pixels in the GIF stay transparent in the favicon, the PNGs and the animation.

Browsers cache favicons for days. Hard-refresh with Ctrl+F5, open the site in a private window, or test it with the Favicon Checker.

No. The favicon files are made in your browser, on your device. Nothing is uploaded.

GIF to Favicon Converter