Create a website favicon set
Generate small browser-tab assets and favicon.ico from a single source image while previewing how the icon reads at tiny sizes.
Icon type
About Icon Generator
Icon Generator combines Zavilo's favicon, web-interface and app-icon workflows into one page. Choose the icon type first, then use the specialized controls for that output.
Common use cases
Prepare web interface icons
Create PNG assets for buttons, menus, toolbars and badges, including wide or tall selections where a square app icon would be inappropriate.
Build PWA and app icon assets
Generate common square sizes used for web apps, Apple touch icons and application icon pipelines.
Reuse one visual source
Start from one logo or illustration and switch between Favicon, Web UI and App / PWA modes instead of maintaining three unrelated workflows.
How it works
1
You choose the icon type that matches the destination: Favicon, Web UI or App / PWA.
2
The selected mode exposes the crop, fitting and size controls appropriate for that kind of icon.
3
The browser renders the requested PNG sizes; Favicon mode can also package compatible PNG images into favicon.ico.
4
You preview and download the generated assets while keeping the original source image unchanged.
Privacy & file handling
Icon generation uses local image processing
Cropping, resizing, previewing and packaging the icon assets are performed in the browser. The source image does not need to be uploaded to Zavilo for icon generation.
Limitations and important notes
- A detailed logo that looks good at 512 pixels may become unreadable at 16 or 32 pixels; simplify the source artwork when necessary.
- The tool avoids inventing detail when the requested size exceeds the useful source resolution.
- Platform-specific publishing systems can impose additional icon requirements beyond pixel dimensions, such as masks, safe zones or metadata.
- Preview shapes can simulate rounded or circular presentation, but downloaded PNG files may remain square because platforms often apply their own masks.
Choose the right icon mode
| Feature | Output shape | Typical sizes | Best use |
|---|---|---|---|
| Favicon | Square | 16–64 px plus favicon.ico | Browser tabs, bookmarks and site identity |
| Web UI | Square, wide or tall | 16–128 px presets | Buttons, menus, toolbars and interface graphics |
| App / PWA | Square | 64–512 px presets | PWA, Apple touch and app source assets |
How to use Icon Generator
- 1
Choose Favicon, Web UI or App / PWA.
- 2
Upload a PNG, JPG or WebP source image.
- 3
Crop or fit the source and select the sizes you need.
- 4
Preview the result and download PNG, ZIP or favicon.ico output where supported.
Tips for better results
- Using a higher-quality original file can help produce a better conversion result.
- Use Web UI mode for buttons, menus, badges and non-square interface graphics.
- Use App / PWA mode for square application assets such as 180, 192 and 512 pixel icons.
Frequently asked questions
Why are favicon, web icon and app icon tools combined?
They all start from an image and generate icon assets, but the specialized controls are preserved as separate modes in one canonical workspace.
Can this create favicon.ico?
Yes. Favicon mode can create favicon.ico as well as common PNG favicon sizes.
Can web icons keep a wide or tall aspect ratio?
Yes. Web UI mode supports a freely sized selection and preserves its aspect ratio.
Which file formats can I use?
Check the file picker and tool description for the supported formats. Available formats can vary by tool.