How to generate favicon in all sizes from svg online free
- Step 1Upload your square SVG — Upload an SVG with a square viewBox (e.g., 0 0 24 24 or 0 0 100 100). The tool pads non-square SVGs to square automatically.
- Step 2Customise background and padding — Choose a background colour (or transparent) and a padding percentage. Browser tabs typically show favicons at 16–32px — a small amount of padding (5–10%) prevents the icon from touching the favicon edges.
- Step 3Download the favicon package — Click Generate and download the ZIP file. It contains favicon.ico, favicon.svg, all PNG sizes, site.webmanifest, and a copy-paste HTML snippet for your head tag.
Frequently asked questions
Do I still need a favicon.ico file in 2026?+
Yes, for backward compatibility. Some bookmarking apps, RSS readers, and enterprise browsers still request favicon.ico from the root URL. Modern browsers prefer favicon.svg or the larger PNGs, but the ICO ensures no broken icon in legacy contexts.
What is the difference between favicon.ico and favicon.png?+
ICO is a multi-resolution container format that can hold multiple bitmap sizes in one file. PNG favicons are single-resolution files loaded by the browser based on the size attribute in the link tag. SVG favicons are resolution-independent and preferred by modern browsers.
What sizes do I need for a PWA?+
Minimum: 192×192 and 512×512 PNG icons referenced in your site.webmanifest. These are used by Android Chrome for home screen icons and splash screens. iOS uses the apple-touch-icon (180×180 PNG) defined separately.
Can I use a dark-mode aware SVG favicon?+
Yes. SVG favicons support CSS media queries. You can use a prefers-color-scheme media query inside the SVG to show a light icon on dark backgrounds and a dark icon on light backgrounds. ICO and PNG favicons do not support dark mode adaptation.
Privacy first
Every JAD SVG tool runs entirely in your browser using the DOM API and Canvas. Your SVG files never leave your device — verified by zero outbound network requests during processing.