Turning Websites into Standalone Apps in macOS Sonoma

With the release of macOS Sonoma, Apple significantly upgraded the Safari browser by introducing the ability to convert any website into a standalone web app that lives directly in the Mac's Dock. This article explores how Apple implemented this feature, the mechanics behind creating these web apps, and how they function independently with their own simplified window, toolbar, and system-level integrations.

The Creation Process

Apple designed the web app creation process to be frictionless, bypassing the need for developers to rewrite their websites for macOS. Users can turn any webpage into an app directly from Safari's interface.

To do this, a user simply navigates to the desired website in Safari, clicks the File menu in the macOS menu bar, and selects Add to Dock (alternatively, this option is available via the Safari Share button). A configuration dialogue immediately appears, allowing the user to type a custom name for the application and even click the auto-generated icon to replace it with a custom image from their file system. Clicking Add instantly places the new web app into the macOS Dock and saves it to a dedicated Applications folder within the user's home directory.

The Standalone Window and Simplified Toolbar

Once launched from the Dock, Spotlight, or Launchpad, the website does not open as a new tab in Safari. Instead, macOS Sonoma encapsulates the site within a specialized, standalone WebKit wrapper.

This creates an app-like experience by stripping away the standard Safari user interface. Gone are the address bar, tab bar, bookmarks, and extension icons. In their place, the web app features a streamlined, minimalist toolbar at the top of its dedicated window. This toolbar contains only essential controls:

  • Back and Forward navigation buttons.
  • A Share button, which also houses options to copy the URL or open the current page in the main Safari browser.
  • Privacy and media indicators (such as microphone or camera usage).

To make the web app feel even more native, Safari reads the website's code—specifically looking for Web App Manifest files—to automatically match the color of the simplified toolbar to the website's specific theme color.

A critical aspect of how Safari manages these web apps is "scoping." A web app needs to know which links should open inside its own window and which links belong in the main web browser.

Safari determines the scope of the web app based on the domain and path used when the app was created. When a user clicks a link that stays within the same host domain, it loads seamlessly inside the web app's window. However, if a user clicks an external link that leads to a different website, the web app automatically routes that link to open in a new tab in the main Safari browser. For complex login flows—such as using a Google or Microsoft account to log into a third-party service—Safari intelligently opens an auxiliary popup window within the web app so the user can authenticate without being kicked out to the main browser.

Deep macOS Integration

Because Safari saves these websites as actual .app bundles in the user's local directory, macOS Sonoma treats them like native applications. This provides several system-level benefits:

  • Window Management: Web apps function independently in Mission Control, Stage Manager, and the Command-Tab application switcher. Users can resize the windows freely, and the web app will remember its window size and position the next time it is opened.
  • Data and Privacy: Upon creation, Safari copies the website's existing cookies into the web app's isolated storage. This means if you are already logged into a website in Safari, you will remain logged in when you open the new web app. Moving forward, the web app maintains its own separate storage, meaning clearing history in Safari does not log you out of your Dock web apps.
  • AutoFill and Keychain: Web apps maintain full access to iCloud Keychain and Passkeys, allowing users to autofill passwords and two-factor authentication codes just as they would in Safari.
  • Notifications: If a website utilizes standard Web Push technology, the standalone web app can request permission to send alerts. These alerts appear as native macOS notifications, and the web app's icon in the Dock can display red notification badges for unread messages or updates.

By combining WebKit's rendering power with macOS's native windowing and notification systems, Safari in macOS Sonoma effectively bridged the gap between traditional websites and native desktop software.