About this tool
Generate a Complete Favicon Set
Drop one source image, ideally 512×512 PNG or SVG, and get every favicon variant your site needs: PNGs from 16×16 to 512×512, a multi-resolution favicon.ico, an Apple touch icon, a PWA maskable icon, a site.webmanifest, and the HTML snippet you paste into <head>. All generated in your browser. Nothing uploads.
Why use OmegaPix
-
Every size, one drop : Default set covers 16, 32, 48, 64, 96, 128, 180, 192, 256, and 512, toggle off any you don't need.
-
Real .ico file : Multi-resolution favicon.ico containing 16/32/48 px PNG payloads. The format Windows and older browsers expect.
-
Drop-in HTML + manifest : ZIP includes site.webmanifest and an install-snippet.html with all the <link> tags ready to paste into your head.
How it works
Drop your source image
PNG, JPG, WebP, or SVG. 512×512 or larger is ideal so downscaling stays sharp.
Pick sizes and extras
Toggle individual PNG sizes. Choose transparent / white / black background. Toggle .ico and PWA maskable.
Download the ZIP
One archive with every variant + manifest + HTML snippet. Drop into your project, paste the snippet into <head>, you're done.
Frequently asked questions
What size should my source image be?
512×512 PNG is ideal, large enough to downscale cleanly to every variant. SVG also works (browser rasterises at each target size, often sharper than a fixed-size PNG source).
Does the .ico file actually contain multiple sizes?
Yes. The output favicon.ico packs 16, 32, and 48 px PNG payloads into a single .ico container. Windows and browsers pick the closest match at render time.
What is a "maskable" PWA icon?
Android PWAs render their app icon inside a mask (circle, squircle, depending on the launcher). Maskable icons reserve the central 80% as "safe area", anything outside may be cropped. The tool generates a 512×512 maskable variant automatically.
Will the icons be sharp at every size?
Depends on the source. A 512×512 source produces sharp results at every variant. Smaller sources mean upscaling for the larger sizes, which looks soft. Start big.
How do I install the icons on my site?
Extract the ZIP into your site's root (or static folder). Paste the contents of install-snippet.html into your <head>. Edit site.webmanifest with your real site name. Done.
Why so many PNG sizes?
Different OS/browser combinations prefer different sizes. 16/32 for desktop tabs, 48 for Windows pinned sites, 96 for Chrome shortcut tiles, 180 for Apple Touch Icon, 192 for Android Chrome, 512 for PWA splash screens.
Is anything uploaded?
No. Verify in DevTools → Network during a generation. No upload requests carrying your image.
Will SVG sources work?
Yes. SVG is preferred for vector logos. The browser rasterises at each target size, often sharper than a fixed-resolution PNG source.
Can I customize the manifest?
The generated site.webmanifest uses placeholder name / short_name values. Edit those to match your site after extracting the ZIP. The icon paths are correct as-is.
What background should I pick?
Transparent for logos. White if your logo is dark and may be displayed on dark surfaces. Black if your logo is light. Most modern browsers handle transparency well, so transparent is usually right.
When to use this tool
New site launch
You designed a logo and need a favicon set to ship before launch. One image in, complete set out.
PWA install icons
Progressive Web App installs need 192×192, 512×512, and a maskable variant. The tool emits all three.
Rebrand refresh
New logo? Regenerate every favicon variant from the updated source in one batch instead of opening 10 separate exports.
When not to use this tool
You only need favicon.ico
For dead-simple sites, a single 32×32 .ico is fine. Skip the tool and use any image editor.
Custom per-size designs
A logo that needs different art at 16×16 (simplified) vs 512×512 (detailed) needs hand-designed variants per size. The tool downsizes from one source.
Animated favicons
Browsers support animated GIF/ICO favicons but support is patchy and many people find them annoying. The tool emits static icons only.
Technical details
Why a multi-resolution .ico still matters
Windows browsers, older Safari versions, and several email clients prefer favicon.ico over PNG. The .ico format is a container. It can hold multiple resolutions, and the browser picks the closest match. The tool packs 16/32/48 px PNGs into one .ico file (Vista+ accepts PNG payloads inside .ico containers).
Apple touch icon and maskable PWA
Apple Touch Icon (180×180) is what iOS uses when a user "Add to Home Screen"s your site. PWA maskable icon (512×512 with central 80% safe area) is what Android renders inside its own circular / squircle mask, critical to look right on every Android version.
Image scaling
The tool uses Canvas2D high-quality bilinear/bicubic resampling. Starting from a 512×512 source produces sharp 16×16 / 32×32 outputs because there's plenty of pixel data to discard cleanly. Starting from a 64×64 source means upscaling for the 128+ sizes: those will look soft.
Background transparency
Default is transparent, best for logos. White or black backgrounds are useful when your logo is one solid color that needs to stand off a neutral surface (Safari sometimes renders favicons against the tab background, which can be dark).
The HTML snippet
install-snippet.html in the ZIP contains the <link> tags for favicon.ico, the 16/32 PNGs, apple-touch-icon, and site.webmanifest. Paste it into your <head>. The order matters, browsers walk top-to-bottom and stop at the first match they support, so put .ico first for IE fallback and PNG sizes after.
Your files stay on your device
Image decoding and resampling run inside your browser via Canvas2D. Your source image is read into memory, downscaled, and emitted as a ZIP locally, nothing is transmitted. Watch DevTools → Network during a generation: zero outgoing requests carry image bytes.