Create favicons from text, emoji, or uploaded images. Generate every size needed for browsers, iOS, Android, and social sharing. Download individual PNGs, a full ZIP package, or copy the HTML code snippet to paste into your site.
Last updated: March 2026 | Free to use, no signup required
Drop an image here or click to browse
PNG, JPG, SVG, or WebP. Will be cropped to square.
A favicon is the small icon displayed in browser tabs, bookmark lists, history entries, and address bars. The name comes from "favorites icon," which dates back to Internet Explorer 5 in 1999 when Microsoft introduced the concept for bookmarked pages. Every modern browser now supports favicons, and they serve as a visual anchor that helps users identify your site among dozens of open tabs.
Favicons also appear on mobile home screens when users save a website as a shortcut, in search engine results on some platforms, and in social media link previews. A missing favicon causes browsers to show a generic globe or blank icon, which reduces recognizability and perceived professionalism. The file format has evolved from the original 16x16 ICO to a range of PNG sizes required by different platforms and devices.
Different browsers and operating systems request favicons at different dimensions. Providing the right sizes ensures your icon looks sharp everywhere, from a tiny browser tab to a large Android home screen tile.
| Size | Usage | Required By |
|---|---|---|
| 16x16 | Browser tab, address bar | All desktop browsers |
| 32x32 | Taskbar shortcut, high-DPI tabs | Windows, macOS browsers |
| 48x48 | Windows site shortcuts | Windows desktop shortcuts |
| 180x180 | Apple Touch Icon (home screen) | iOS Safari, iPadOS |
| 192x192 | Android home screen, PWA icon | Chrome for Android, PWA manifest |
| 512x512 | PWA splash screen, Google search | Web app manifest, Google |
The 16x16 and 32x32 sizes handle nearly all desktop browser scenarios. The 180x180 Apple Touch Icon is used when iOS users add your site to their home screen. The 192x192 and 512x512 sizes are specified in the web app manifest file and are required for Progressive Web Apps and Android home screen shortcuts. This generator creates all six sizes from a single source design.
After generating your favicon files, place them in the root directory of your website (or any directory you prefer, as long as the paths in your HTML match). Add the <link> tags from the code snippet above into the <head> section of every page on your site. If you use a static site generator or CMS, this typically goes in a shared layout template or header partial.
For Progressive Web Apps, you also need a site.webmanifest file that references the 192x192 and 512x512 icons. A minimal manifest looks like this:
Place the manifest JSON in your root directory and reference it with <link rel="manifest" href="/site.webmanifest">. Modern browsers cache favicons aggressively, so after updating your icons you may need to clear your browser cache or append a query string to the link tag URL to force a refresh during development.
For WordPress sites, most themes provide a "Site Identity" section in the Customizer where you can upload a 512x512 PNG directly. The theme will generate the smaller sizes automatically. For custom HTML sites, the manual approach using link tags gives you the most control.
Keep the design simple. At 16x16 pixels, fine details are invisible. Favicons that work well tend to use a single letter, a simple geometric shape, or a bold logomark with high contrast. Avoid full logos with text -- they become unreadable blobs at small sizes.
Use your brand color as the background. A colored background makes your favicon stand out in a row of browser tabs, especially in dark mode where many sites use white or gray icons. Transparent backgrounds can work for simple shapes but tend to disappear against certain browser themes.
Test at actual size. A favicon that looks good in a 512px preview may be indistinguishable at 16px. Always check how it renders in an actual browser tab before deploying. This generator shows you all sizes side by side for exactly this reason.
Use PNG for modern browsers. The ICO format was necessary for older versions of Internet Explorer, but all current browsers support PNG favicons natively. PNG files are smaller and easier to generate. If you need ICO format for legacy support, you can convert a 32x32 PNG using any image converter.
Include the Apple Touch Icon. Even if you are not building a PWA, many users will save your site to their home screen. Without the 180x180 Apple Touch Icon, iOS will use a screenshot thumbnail instead of your designed icon.
PNG is the recommended format for favicons on modern websites. Every current browser version supports PNG favicons, and the files are typically smaller than ICO equivalents. SVG favicons are also gaining traction and are supported by Chrome, Firefox, Edge, and Safari 15+, but PNG remains the safe universal choice. The ICO format is only necessary if you need to support Internet Explorer, which Microsoft retired in 2022.
At minimum, you need a 32x32 PNG for desktop browsers and a 180x180 PNG for the Apple Touch Icon. Browsers can scale these to fit other contexts. However, providing all six standard sizes (16, 32, 48, 180, 192, 512) ensures the sharpest rendering across every device and platform, including Progressive Web App manifests and Android home screen shortcuts. This generator creates all sizes at once, so there is no reason to skip any.
Browsers cache favicons aggressively and sometimes retain the old icon for days. To force a refresh: clear your browser cache, or open the favicon URL directly in a new tab (e.g., yoursite.com/favicon-32x32.png) and hard-refresh with Ctrl+Shift+R. During development, appending a cache-busting query parameter like ?v=2 to your link tag href can help. Also verify that the file paths in your HTML head match the actual locations of the PNG files on your server.
Yes. This generator supports emoji input directly. Type or paste any emoji character into the text field and it will be rendered onto the favicon canvas at every standard size. Emoji favicons are popular for personal blogs, side projects, and rapid prototyping because they are instantly recognizable without any design work. The rendering uses your operating system's native emoji font, so the exact appearance may vary slightly between macOS, Windows, and Linux.
No. All processing happens locally in your browser using the HTML5 Canvas API. Uploaded images, drawn designs, and generated favicons never leave your device. There is no server-side component. This means the tool works offline after the page loads, and your images remain completely private.