A progressive web app (PWA) is an installable website with its own window and launcher icon. Link a web app manifest with <link rel="manifest" href="app.webmanifest">. Chromium 4,389 offers installation when it has name or short_name, start_url, a display other than browser, and 192 px and 512 px icons (Favicons and App Icons), served over HTTPS or localhost; a service worker is optional. Safari 17 10 adds sites to the macOS Dock, iOS 16.4+ browsers add them to the Home Screen, and Firefox 555 desktop cannot install PWAs.
{
"name": "Trail Notes: Hiking Journal", "short_name": "Trail Notes",
"id": "./", "start_url": "./?source=pwa", "display": "standalone",
"theme_color": "#1565c0", "background_color": "#ffffff",
"icons": [
{ "src": "icons/icon-192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "icons/maskable-512.png", "sizes": "512x512", "purpose": "any maskable" }
]
}Two more manifest members make an installed app behave less like a tab. "launch_handler": { "client_mode": "focus-existing" } (Chromium 110) stops a second window from opening on relaunch, and window.launchQueue.setConsumer() receives the target URL so you can route to it yourself. "display_override": ["window-controls-overlay"] (Chromium 105) hands the title-bar strip to your markup, laid out with env(titlebar-area-x) and env(titlebar-area-width). Both are Chromium-only.
Chrome 1 's DevTools Protocol method Page.getInstallabilityErrors found no errors here; a manifest without start_url and icons, set to "display": "browser", produced start-url-not-valid, manifest-display-not-supported and icon errors (also listed in the Application panel, Application Panel). For a custom Install button in Chromium, save the beforeinstallprompt event and call its prompt() on click. The media query (display-mode: standalone) matches inside the installed app.