Progressive web apps on Windows look more like native Windows apps than ever before. Thanks to a new feature that Microsoft just announced, the Window Controls Overlay, developers can now customize the title bar of their PWAs.
Previously, web apps did not have access to this feature, which could lead to empty space, clashing colors, and other oddities that made some PWAs look decidedly un-app-like. The new feature should help developers fix these problems. Web apps now have access to the “full surface area” of their app window, excluding only the buttons in the top-right corner — minimize, etc. remain untouchable.
“Recently, with many new web capabilities in the Chromium browser engine and UX changes in Microsoft Edge and on Windows, installed desktop web apps are really starting to look and feel like native apps,” writes senior program manager Patrick Brosset in a blog post for Microsoft. “While native apps have been able to display content anywhere in the app window, including in the title bar, installed web apps have been forced to go with the default experience, making them visually different. We’re excited to announce the availability of a new PWA feature that closes this gap and helps blur the line between apps and websites even more.”
“We believe PWAs are a great fit for making desktop web applications. Turning your website into an app that really feels like it belongs on desktop has never been so easy and using the Window Controls Overlay feature will help you create desktop apps that look much more modern and engaging to your users,” Microsoft’s post reads.