Skip to content
App builder tools

PWA App Builder

Generate the manifest, icons, service worker and offline page a website needs to become installable.

App details

These become the manifest fields browsers show in the install dialogue.

Must be HTTPS. Browsers will not install a PWA served over plain HTTP.

12 characters or fewer — it sits under the home screen icon.

Path the app opens on.

Paths that stay inside the app window.

Icon

One square image produces every size, including maskable variants and favicon.ico.

Your image is resized on a canvas inside this tab. It is never uploaded to Toolspea or anywhere else.

Appearance

Tints the status bar and title bar.

Used for the generated splash screen.

Comma separated.

Offline behaviour

A service worker with a fetch handler is what unlocks the install prompt in Chromium browsers.

Generates sw.js plus a registration script in the head snippet.

Bump this on every deploy to evict the old shell.

{
  "id": "/",
  "name": "My App",
  "short_name": "App",
  "description": "",
  "start_url": "/",
  "scope": "/",
  "display": "standalone",
  "orientation": "any",
  "theme_color": "#7C4DFF",
  "background_color": "#0B0B12",
  "lang": "en",
  "dir": "auto",
  "icons": [
    {
      "src": "icons/icon-72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "icons/icon-96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "icons/icon-128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "icons/icon-144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "icons/icon-152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "icons/icon-180.png",
      "sizes": "180x180",
      "type": "image/png"
    },
    {
      "src": "icons/icon-192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "icons/icon-256.png",
      "sizes": "256x256",
      "type": "image/png"
    },
    {
      "src": "icons/icon-384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "icons/icon-512.png",
      "sizes": "512x512",
      "type": "image/png"
    },
    {
      "src": "icons/maskable-192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "maskable"
    },
    {
      "src": "icons/maskable-512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "maskable"
    }
  ],
  "categories": [
    "utilities",
    "productivity"
  ],
  "shortcuts": [
    {
      "name": "Open app",
      "short_name": "Open",
      "url": "/",
      "icons": [
        {
          "src": "icons/icon-192.png",
          "sizes": "192x192"
        }
      ]
    }
  ]
}

What is PWA App Builder?

Toolspea PWA App Builder generates the manifest, icons, service-worker starter, offline page and integration files needed to prepare a website for installable PWA behaviour. You enter your site details, upload a square icon, choose display and colour settings, preview the result on Android, iPhone and Windows, run a readiness check, and download a ZIP you drop into your web root.

What is a PWA?

A Progressive Web App is an ordinary website that ships three extra things: a web app manifest describing how it should look when installed, a service worker that can answer requests when the network cannot, and HTTPS. With those in place, supporting browsers offer to install the site, and it then runs in its own window with its own icon rather than in a tab.

Nothing about a PWA replaces your website. The same URL serves the same HTML to everyone; installation is an enhancement for the people who want it.

How to turn a website into a PWA

Serve the site over HTTPS. Publish a manifest at /manifest.webmanifest with a name, short name, start URL, scope, display mode, theme and background colours, and icons that include at least 192px and 512px. Link it from every page with <link rel="manifest">. Register a service worker at the root of your site that has a fetch handler, so the app can respond when offline.

This builder produces all of that from a form, including the head snippet to paste and a README describing exactly where each file goes.

PWA for Android

Android has the most complete support. Chrome, Edge and Samsung Internet show an install prompt once the manifest, icons and a service worker with a fetch handler are in place. The installed app gets its own launcher icon, a standalone window with no browser UI, a splash screen the system builds from your name, icon and background colour, and the theme colour applied to the status bar.

Supply maskable icons or Android will place your square artwork inside a white blob. The builder generates maskable 192 and 512 variants with the artwork inset into the safe zone.

PWA for iPhone and iPad

iOS and iPadOS install a web app through Safari's Share menu, then Add to Home Screen. There is no automatic install prompt, so tell your users the steps. The apple-touch-icon controls the home screen artwork and the apple-mobile-web-app meta tags control the status bar appearance; both are in the generated snippet.

Capabilities differ from Android and move between iOS versions — storage eviction, push support and background behaviour have all changed repeatedly. Design for the case where an installed iOS web app behaves like a very good bookmark with offline caching, and treat anything more as a bonus.

PWA for Windows

On Windows, Microsoft Edge and Chrome install a PWA that meets the installability requirements into its own window with a taskbar icon, a Start menu entry, and an entry in Installed apps. The manifest name and icons drive all three, so the 256px and 512px icons matter on desktop even though phones rarely use them.

Publishing to the Microsoft Store is a separate packaging process. This tool prepares the manifest metadata that such a package would use; it does not submit anything to any store.

PWA vs native app

A PWA installs from a URL in seconds, updates the moment you deploy, and needs no review. A native app can use platform APIs a browser does not expose, appears in store search, and can be distributed through store billing. Neither is universally better.

A common middle path is exactly what Toolspea offers: ship the PWA for the web, and generate an Android WebView project when you also need a store presence.

PWA requirements

For an install prompt in Chromium browsers you need HTTPS, a linked manifest with name or short_name, a start_url, a display mode of standalone, fullscreen or minimal-ui, icons of at least 192px and 512px, and a registered service worker with a fetch event handler. iOS requires only the apple-touch-icon and meta tags for a usable home screen app.

The readiness check in this tool grades what it can see in your configuration. It never pretends to have audited your live site, because a page in your browser cannot verify another origin's headers.

How to use it

  1. 1Enter your website URL and app details.
  2. 2Upload a square icon of 1024×1024 or larger.
  3. 3Pick theme and background colours, display mode and orientation.
  4. 4Choose a service-worker caching strategy and an offline page URL.
  5. 5Preview the result on Android, iPhone and Windows, then run the readiness check.
  6. 6Download the ZIP and copy its files to your web root.

Features

  • Complete manifest.webmanifest with id, scope, display, orientation, shortcuts and categories
  • Ten PNG icon sizes plus maskable 192 and 512, apple-touch-icon and a real multi-size favicon.ico
  • Service worker starter with five caching strategies and cache versioning
  • Branded offline fallback page matched to your colours
  • Head snippet with manifest, theme colour, Apple meta tags and registration script
  • Live Android, iPhone and Windows previews that update as you type
  • Readiness score with honest pass, warning and fail checks
  • Everything generated in your browser — the icon is never uploaded

When people use it

Making an existing site installable

Add a manifest and icons to a site that already works well on mobile and let visitors keep it on the home screen.

Passing an installability audit

Produce the manifest fields and icon sizes Lighthouse and Edge look for, without hand-writing JSON.

A first service worker

Start from a commented worker with a sensible strategy instead of copying an unexplained snippet.

Kiosk and internal displays

Fullscreen display mode with a fixed start URL gives a locked-down window on a shared device.

Known limits

  • A PWA is not automatically an App Store or Play Store listing — store publication needs a separate packaging step this tool does not perform.
  • Toolspea cannot audit your deployed site from your browser, so live installability is never claimed as verified.
  • iOS and iPadOS support differs from Android and Windows and changes between OS versions.
  • You must upload the generated files to your own web root; nothing is published on your behalf.

PWA App Builder questions

Related tools

Hand-picked hubs, guides and companion tools related to this page.

Last reviewed 2026-08-15. Browse the full directory.