Favicon & Manifest Generator

Now available as an installable PWA. Try it at favicons-pwa.philipnewborough.co.uk.

Web App Manifest Settings

These values are used to generate the manifest.json file included in the download. All fields are required before uploading.

Name *

The full name of your web application.

Short Name *

A short name used where space is limited (e.g. home screen). Max 12 characters.

Description *

A brief description of your web application.

Theme Color *

The toolbar/accent colour shown in the browser when your app is open.

Background Color *

The background colour shown on the splash screen when your app is launched.

Display Mode *

standalone hides browser UI — minimal-ui shows back/reload — fullscreen no browser chrome — browser normal tab.

Orientation

Controls screen rotation when installed as a PWA.

Upload Image

Image must be PNG and at least 512px × 512px.

Click Upload to open a file picker and select your image. Once selected, the image will be uploaded and processed automatically — no need to click again.

Your image must be a PNG file and at least 512×512 pixels. From that image, this tool will:

Create a classic favicon.ico file
Resize the icon to 16×16, 32×32, 48×48, 64×64, 128×128, 180×180, and 256×256 pixels
Generate two placeholder screenshots required by the Web App Manifest spec — a mobile one (750×1334px) and a desktop one (1280×720px) — each showing your icon centred on the manifest background colour
Create a manifest.json file using the settings above
Generate the HTML code to include in your website

A download link will appear below once processing is complete.

Favicon Download

Download favicons.zip

Usage

Extract the ZIP and copy all files to the root of your web server's public directory (the same folder as your index.html).

Add the following to the <head> section of every HTML page:

<link rel="shortcut icon" href="/favicon.ico">
<link rel="icon" type="image/png" sizes="16x16" href="/icon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/icon-32x32.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#ffffff">

The remaining icon sizes and screenshots in the ZIP are referenced automatically by manifest.json.