Favicon Generator
Create perfect favicons for all platforms in seconds.
How it worksStart from
Shown in the tab mocks and written into site.webmanifest.
Live Preview
See how your favicon looks everywhere
Choose an image above and the live preview and all five files fill in below.
Customize
Fine-tune your favicon
0%
A wordmark exported edge-to-edge needs breathing room; an icon drawn to fill its tile does not.
20%
As a percentage of the tile edge — 20% matches iOS.
Generated Favicon
Choose an image above and the live preview and all five files fill in below.
or
Add favicon to your website
View the install snippet
Paste into your <head>
<link rel="icon" href="/favicon.ico" sizes="48x48"> <link rel="icon" type="image/png" sizes="192x192" href="/icon-192.png"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
site.webmanifest
{
"name": "Scult",
"short_name": "Scult",
"icons": [
{
"src": "/icon-192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icon-512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}Already inside the ZIP. Upload all five files to your site root, next to index.html — the paths above assume exactly that.
Waiting for a source
Your files are processed in your browser. We never upload your data.
