Favicon Generator
Generate favicons in all sizes from 16×16 to 512×512 from any image, emoji or text initials. Includes multi-resolution ICO, Apple Touch Icon, PWA manifest and Windows tile. Download as ZIP with a copy-ready HTML snippet. 100% browser-based — nothing uploaded.
Favicon Generator Tool
All favicon sizes and formats — what each one is for
Modern websites need more than a single favicon.ico. Different browsers, devices and operating systems each request specific image sizes and formats. This generator produces the complete set automatically.
- favicon.ico 16+32+48px
- favicon-16x16.png 16px
- favicon-32x32.png 32px
- favicon-48x48.png 48px
- apple-touch-icon.png 180px
- Home screen shortcut 180px
- Safari Reading List 180px
- android-chrome-192.png 192px
- android-chrome-512.png 512px
- site.webmanifest JSON
- mstile-150x150.png 150px
- browserconfig.xml XML
- Taskbar / pinned sites
- favicon-96x96.png 96px
- Shown in search results
- google.com/s2/favicons
- favicon-256x256.png 256px
- favicon-512x512.png 512px
- Desktop shortcuts
Everything in this free favicon generator
Most free favicon tools only convert an image to a single ICO file. This generator creates the complete favicon package that modern web development requires — across all browsers, devices and operating systems.
How to create a favicon — step by step
<head> section of every page. For WordPress, upload the 512×512 PNG via Appearance → Customize → Site Identity → Site Icon — WordPress generates the other sizes automatically.How this favicon generator compares to alternatives
Most free favicon generators only convert an image to a single ICO file. The tools that do generate a full package either upload your files to a server or lock features behind an account. LazyTools generates the complete set in your browser.
| Feature | LazyTools ✦ | favicon.io | RealFaviconGenerator | Favicon.cc |
|---|---|---|---|---|
| Generate from image upload | ✔ Yes | ✔ Yes | ✔ Yes | ✔ Yes |
| Emoji to favicon | ✔ Any Unicode emoji | ✔ Yes | ✘ No | ✘ No |
| Text / initials mode | ✔ Yes | ✔ Yes | ✘ No | ✘ No |
| All PNG sizes (16–512px) | ✔ 11 sizes | ✔ Yes | ✔ Yes | ✘ Limited |
| Multi-resolution ICO (16+32+48) | ✔ Yes | ✔ Yes | ✔ Yes | ✔ Yes |
| Apple Touch Icon 180×180 | ✔ Yes | ✔ Yes | ✔ Yes | ✘ No |
| Android/PWA 192×192 & 512×512 | ✔ Yes | ✔ Yes | ✔ Yes | ✘ No |
| site.webmanifest (PWA) | ✔ Yes | ✔ Yes | ✔ Yes | ✘ No |
| Windows tile + browserconfig.xml | ✔ Yes | ✘ No | ✔ Yes | ✘ No |
| Browser tab dark mode preview | ✔ Light + dark | ✘ No | ✘ No | ✘ No |
| Background colour + shape control | ✔ Yes | ✔ Yes | Partial | ✘ No |
| Copy-ready HTML head snippet | ✔ Yes | ✔ Yes | ✔ Yes | ✘ No |
| 100% browser-based — no upload | ✔ Always | ✔ Yes | ✘ Uploads to server | ✘ Server-based |
| No account required | ✔ Yes | ✔ Yes | ✔ Yes | ✔ Yes |
The Complete Guide to Favicons — Sizes, Formats and Modern Implementation
A favicon is the small icon displayed in browser tabs, bookmarks, address bars and search engine results next to your website's title. Despite its size — typically just 16×16 pixels in a browser tab — the favicon plays a significant role in brand recognition, professionalism and user experience. A missing or low-quality favicon signals a site that has not been properly configured. A well-crafted favicon, visible in a tab among dozens of competitors, helps users identify and return to your site.
The history and evolution of favicons
The favicon was invented by Internet Explorer 5 in 1999. The original format was a single 16×16 pixel ICO file placed at the root of the domain as /favicon.ico. Browsers would automatically request this file whether or not you specified it in your HTML, and the name "favicon" came from "favourites icon" — IE5 displayed it next to bookmarked pages in the Favourites menu.
The standard has expanded substantially since then. Apple's introduction of the iPhone in 2007 brought the Apple Touch Icon — a 180×180 PNG used when iOS users save a website to their home screen. Android's Progressive Web App specification added 192×192 and 512×512 requirements for PWA install icons. Microsoft added Windows tile support. Modern browsers now also support SVG favicons, which scale perfectly at any resolution and can change appearance based on the user's colour scheme preference.
What favicon sizes do you actually need in 2025?
The minimum required set for a modern website is surprisingly broad. Browser tabs need 16×16 and 32×32 PNGs (for standard and retina displays), plus a multi-resolution ICO at your domain root for legacy compatibility. iOS home screen shortcuts require a 180×180 Apple Touch Icon. Android home screen and PWA install prompts need 192×192 and 512×512 icons referenced in a site.webmanifest file.
Google Search also fetches favicons to display next to your result in the search listings. Google uses a 48×48 icon scaled to display at 16px — it requests /favicon.ico or the icon specified in a link tag. A properly sized, recognisable favicon can improve click-through rates on search result pages by increasing brand recognition.
The modern favicon stack — what to include in your HTML head
The recommended favicon implementation for 2025 includes the following tags in your HTML head. First, a link to favicon.ico for legacy browser compatibility and PDF tab display. Second, PNG link tags for 16×16 and 32×32 for modern browsers. Third, an Apple Touch Icon link for iOS. Fourth, a manifest link pointing to site.webmanifest for Android and PWA. Finally, a theme-color meta tag that sets the browser UI colour on mobile.
The HTML snippet generated by this tool includes all of these tags in the correct format. Copy and paste it directly into your HTML head before the closing </head> tag. No modification is required — the paths assume all favicon files are in your website root directory.
ICO format — why you still need it
The ICO format is the only image format that can embed multiple image resolutions in a single file. A well-constructed favicon.ico contains 16×16, 32×32 and 48×48 pixel versions — the browser picks the most appropriate size for each context. The 16px version appears in browser tabs; the 32px version appears in bookmark menus and Windows taskbar pinned sites; the 48px version appears in Windows Explorer file views.
The most important remaining use case for favicon.ico is PDF display. When a browser opens a PDF from your domain (for example, example.com/document.pdf), it requests example.com/favicon.ico to show in the browser tab — regardless of any link tags in your HTML. Keeping favicon.ico at your domain root is therefore still essential in 2025, even though PNG and SVG are preferred for modern display contexts.
Emoji favicons — why they work
Emoji favicons have become popular in the developer community because they require zero design work and render surprisingly well at small sizes. The secret is that emoji are already designed to be recognisable at tiny sizes — they are rendered from high-quality vector or bitmap font systems with extensive hinting for small pixel counts.
On a solid background colour (rather than transparent), an emoji favicon is often more legible at 16×16 than a complex logo. The solid background also prevents the transparency issues that plague some PNG favicons on dark browser themes. Emoji favicons work especially well for personal projects, blogs, side projects and tools — situations where a specific branded logo is less important than instant recognisability.
PWA manifest and site.webmanifest
The Progressive Web App specification requires a site.webmanifest file for Android home screen installation and the "Add to Home Screen" prompt. The manifest is a JSON file that declares your app's name, short name, theme colour, background colour, display mode, and — critically — the icons to use at 192×192 and 512×512 pixels.
Without a valid webmanifest referencing 192×192 and 512×512 icons, your site cannot qualify as a PWA and Android Chrome will not offer the install prompt. Even for non-PWA websites, a webmanifest improves the experience when users save your site to their home screen, displaying your app name and icon correctly rather than a screenshot thumbnail.
Dark mode favicons — a commonly missed consideration
Modern operating systems and browsers offer dark mode, and browser tabs adopt a dark theme in this mode. A favicon with a white or very light background colour can become nearly invisible on a dark browser tab — a problem that is only visible to dark mode users and often goes unnoticed by developers testing on light backgrounds.
The recommended solutions are: use a coloured background (avoid pure white or very light grey), use a shape (rounded or circle) that creates a defined boundary between the icon and the browser tab chrome, or use an SVG favicon with a CSS media query that switches the icon for dark mode. The browser tab preview in this tool shows your favicon in both light and dark contexts so you can catch visibility issues before deploying.