Favicon Generator
Create a complete favicon set from an image or a letter: favicon.ico with 16, 32 and 48 px, PNG icons, an apple-touch-icon and web app manifest icons, with the HTML to use them.
Free · No sign-up · Your inputs stay in your browser
Input
Generate a favicon set
Output
Rendering...
HTML head
<link rel="icon" href="/favicon.ico" sizes="48x48"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
site.webmanifest icons
{ "icons": [ { "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" }, { "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" } ] }
A modern set is small: favicon.ico (16, 32 and 48 px inside one file, for old browsers and tools that request /favicon.ico directly), a 180 px apple-touch-icon, and 192 and 512 px icons for the web app manifest. An SVG favicon with a prefers-color-scheme media query is the one extra worth adding by hand.
Runs in this browser. Nothing you paste is sent to a server.
About this tool
Method, assumptions, practical next steps, and limits.
The modern minimum
Browsers and tools still request /favicon.ico directly, so keep one at the root with 16, 32 and 48 px images inside. iOS uses apple-touch-icon for home screen bookmarks, and Android and installable web apps use the 192 and 512 px icons from the web app manifest. An ICO file can hold PNG images, which every current browser reads.
Small sizes need simple shapes
A detailed logo becomes a smudge at 16 pixels. A single letter or a simplified mark on a solid background reads in a crowded tab bar; that is why the letter mode exists.