Web Icons
Everything you need for websites. Place these files on your site and reference them with standard meta/link tags.
Output folder: web/
- Favicons (
favicon-16.png,favicon-32.png,favicon.ico) - Apple touch icons (including
apple-touch-icon-180.png) - Large PNGs for Android/Chrome prompts (
manifest-192.png,manifest-512.png) - Reference file:
icons-head.html
Choose Web
From the project row, click the Web download to create the web package ZIP.
Save the ZIP
Choose where to save. The ZIP is named:
<project name> - Web - svg2icon.zip (a (n) suffix is added if a file with the same name already exists).
Web folder (inside ZIP)
After you extract the ZIP, open the web/ folder to see all files.
Reference in HTML
<!-- Favicons -->
<link rel="icon" type="image/png" sizes="16x16" href="/web/favicon-16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/web/favicon-32.png">
<link rel="icon" href="/web/favicon.ico">
<!-- Apple touch icon (general) -->
<link rel="apple-touch-icon" href="/web/apple-touch-icon-180.png">
<!-- Android/Chrome (install prompts) -->
<link rel="icon" type="image/png" sizes="192x192" href="/web/manifest-192.png">
<link rel="icon" type="image/png" sizes="512x512" href="/web/manifest-512.png">
<!-- Optional: browser UI color -->
<meta name="theme-color" content="#000000">
web/icons-head.htmlcontains the full set of tags you can copy into your pageās<head>.
The
web/manifest.jsonfile in your bundle is generator metadata, not a full web app manifest. If you need a PWA manifest, create one for your site and point to it separately.