Install web apps with the new HTML install element | Blog | Chrome for Developers
Skip to main content
English
Deutsch
Español – América Latina
Français
Indonesia
Italiano
Nederlands
Polski
Português – Brasil
Tiếng Việt
Türkçe
Русский
עברית
العربيّة
فارسی
हिंदी
বাংলা
ภาษาไทย
中文 – 简体
中文 – 繁體
日本語
한국어
Sign in
Blog
Chrome for Developers
Blog
Install web apps with the new HTML install element
Stay organized with collections
Save and categorize content based on your preferences.
Patrick Brosset
Homepage
Published: May 12, 2026
Installing web apps has always required JavaScript. When you use the<br>beforeinstallprompt event, the installation flow lives entirely in script. The<br>new element changes that: drop a single HTML element into your page<br>and the browser renders a trusted install button for you, with no JavaScript<br>required.
The Microsoft Edge team, in collaboration with the Chrome team, implemented the<br>element in Chromium. It's now available for you to test<br>behind a flag in Chrome or Edge from version 148, and as an<br>origin trial<br>which you can use in both browsers starting with 148 and ending with 153.
Try it, and learn how it compares to the imperative Web Install<br>API<br>(navigator.install()), which has its own origin<br>trial.
The problem
Web app installation is fragmented. Every browser has its own set of entry<br>points, for example address-bar icons, menu items, and prompts. Developers have<br>limited control over when and how the install flow is surfaced.
Building an app-store-like experience that lets users install other apps from<br>your site is harder, because installation has historically been restricted to<br>the current page.
The element
The new HTML element's content and presentation is controlled by the<br>browser. Similar to other permission elements like , the<br>browser's control over the button's label text, language, and appearance means<br>it can trust the user's click as a genuine signal of intent.
A user who clicks a button labeled "Install Wonderful Application" is unlikely<br>to be surprised when an install prompt appears.
Because the browser renders the button, you get a trusted install affordance<br>with minimal code and no need to orchestrate the beforeinstallprompt ceremony<br>in JavaScript.
Install the current app
If the current page links to a manifest that has an<br>id<br>field, a single element is all you need:
The browser renders the button with standardized text and iconography, and when<br>the user clicks it, the browser's normal installation flow kicks in.
Install a different app
To install a web app that's on a different origin than the current page, use the<br>installurl attribute to point to the other web app:
If the page at https://awesome-app.com links to a<br>manifest which defines an id field, then that's all you need to do.
If no id field exists, use the manifestid attribute to provide a computed<br>manifest id:
To get the computed manifest id:
Open DevTools.
Go to the Application tab.
Under the Identity section, copy the Computed App ID value.
Using the button to install other origin apps means you can build a<br>catalog page that lets users install multiple apps, each with its own<br>button.
Provide fallback content
If the browser doesn't support the element, whatever HTML you put<br>inside the element is displayed:
Launch Awesome App
Detect support
If the fallback content isn't enough for your use case and you prefer to<br>implement a different user experience on browsers that don't support the<br>element, use JavaScript to detect support:
if ('HTMLInstallElement' in window) {<br>// The element is supported.
Handle events
The element fires events you can listen to for success, dismissal,<br>and validation errors:
const button = document.querySelector('install');
button.addEventListener('promptaction', () => {<br>console.log('Installation succeeded');<br>});
button.addEventListener('promptdismiss', () => {<br>console.log('User dismissed the install prompt');<br>});
button.addEventListener('validationstatuschanged', (e) => {<br>if (e.target.invalidReason === 'install_data_invalid') {<br>console.error('Invalid install data:', e.target.invalidReason);<br>});
Try it today
To try the element today, you have two options:
Test the element locally on your device only.
Test the element in real conditions, with your users, by registering for the<br>origin trial.
Test locally
To test the element on your own device today:
Use Chrome or Edge version 148 or later.
Go to about://flags/#web-app-install-element in a new tab.
Set Web App Install Element to Enabled .
Restart the browser.
Test on your live site using the origin trial
The origin trial lets real users on your production site use the feature without<br>having to enable the flag first.
Open the element origin trial registration page.
Sign in.
Click Register .
Enter your site's origin, and fill the rest of the form.
Once the form is submitted, you get a token string.
Add the token to your site's pages by using a tag:
Alternatively, you...