How to generate favicon and PWA icons

Use one PNG or SVG source to export favicon.ico, Apple touch icon, and PWA files with consistent spacing.

Recommended source input

  • PNG or SVG source, ideally square and at least 512×512.
  • Transparent background works best for logos that need flexible placement.
  • If your file is not square, the tool auto-pads canvas and keeps the subject centered.

3-step workflow

  1. Upload source and confirm subject bounds preview looks correct.
  2. Choose Balanced or Safe padding mode, then review favicon and PWA previews.
  3. Download ZIP to get favicon.ico, 16/32/48 PNG, Apple 180, and PWA 192/512 files.

Example output set

Input: 1024×1024 transparent brand mark (SVG).

Settings: Balanced padding + transparent background.

Output: favicon.ico, favicon PNG sizes, apple-touch-icon, and PWA icons ready for deployment.

FAQ

Should favicon and PWA icons use the same source?

Yes. One high-quality source is usually enough when spacing is handled consistently.

Why do tiny favicon sizes still look blurry?

Very small sizes need simple shapes. Try cleaner source details and more safe margin.

Do I need to manually create every icon size?

No. The tool exports all common website and PWA icon sizes in one package.

Related entries

Back to icon generator

Return to the main workspace and generate your files now.

Maskable safe area guide

Learn how to avoid launcher cropping for adaptive icons.

SVG to icon pack guide

Convert one SVG into a complete downloadable icon bundle.

JSON Formatter

Format and validate manifest JSON before publishing your site.