PWA Basics

What is manifest.json?

A simple guide to web application manifests and how they power progressive web apps.

Understanding the Manifest

A web application manifest, defined in the Web Application Manifest specification, is a JSON text file that provides information about a web application.

The most common use for a web application manifest is to provide information that the browser needs to install a progressive web app (PWA) on a device, such as the app's name and icon.

A web application manifest contains a single JSON object where the top-level keys are called members.

Why Manifest.json Matters

Benefit

PWA Installation

The manifest enables browsers to prompt users to install your web app on their device, making it feel like a native application.

Benefit

Icon References

The manifest tells browsers which icon files to use for different contexts—home screens, splash screens, and app launchers.

Benefit

App Metadata

It provides essential information like your app's name, theme colors, display mode, and start URL for a consistent experience.

The Icon Challenge

Creating a complete manifest.json requires generating and referencing icons in multiple sizes. Each size serves a specific purpose across different platforms and contexts.

192x192

Standard Android home screen icons

512x512

High-resolution splash screens and Android

96x96

Desktop shortcuts and Google TV

32x32

Browser tabs and bookmarks

16x16

Address bar and legacy browser support

How Favicon Tools Helps

Manually creating all the required icon sizes and maintaining a manifest.json file can be time-consuming and error-prone. Favicon Tools automates this entire process.

Automatic Generation with Full Coverage

When you use Favicon Tools to generate your favicons, we automatically create a complete manifest.json file that includes references to ALL the icon sizes you need:

Android icons (192x192, 512x512) for home screen shortcuts and splash screens
Standard favicons (16x16, 32x32, 96x96) for browser tabs and bookmarks
Apple touch icons in all required sizes for iOS devices
Windows tiles for Microsoft Start Menu integration

This means you get full coverage across all platforms and contexts without having to manually configure each icon size or maintain the manifest file yourself.

Example Manifest.json

Here's what a complete manifest.json looks like, automatically generated by Favicon Tools:

{
  "name": "Favicon Tools",
  "short_name": "Favicons",
  "start_url": "/",
  "display": "standalone",
  "scope": "/",
  "background_color": "#ffffff",
  "theme_color": "#ffffff",
  "icons": [
    {
      "src": "/android-icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/favicon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "/favicon-32x32.png",
      "sizes": "32x32",
      "type": "image/png"
    },
    {
      "src": "/favicon-16x16.png",
      "sizes": "16x16",
      "type": "image/png"
    }
  ]
}

This manifest includes all the essential icon references needed for PWA installation and proper display across different platforms. Favicon Tools generates this automatically along with all the referenced icon files.

One-Click Generation

Upload your source image once, and Favicon Tools generates every icon size you need plus a complete manifest.json file—all in one downloadable package.

No need to manually resize images, create multiple files, or write JSON by hand. Everything is ready to drop into your project.

Always Up to Date

When you regenerate your favicons after a rebrand or design update, the manifest.json is automatically updated with the correct icon references.

This ensures your manifest never gets out of sync with your actual icon files, preventing broken references and missing icons.

Generate Your Complete Manifest.json