46

I keep ending up with a myriad of open tabs in Chrome. It is a pain to switch between them compared to switching between regular Mac apps.

So I would like to be able to:

  • pin them to the taskbar
  • identify them using their favicon (taskbar / Cmd+Tab)
  • always open them in a separate window

Just like it appears to be possible on Windows: How to Turn Web Apps Into First-Class Desktop Citizens

I am looking for a solution with Chrome. But if there's a solution with another browser I may even consider switching...

agarza
  • 2,274
Mutual Exception
  • 619

7 Answers7

76

Found a great way on Chrome Version 75.0.3770.100:

  1. Go to the website you want to convert to an app

  2. Click on three dots / more tools / Create Shortcut + make sure to tick 'open in new window'

That's it - you now have an app that you can pin to your dock and you can cycle through them with cmd + tab. Awesome!

pkamb
  • 8,791
Pyotr Li
  • 861
  • 3
    This is it! I don't have the "reputation" yet on this site to be able to vote, but this is the one. – Dave Abrahams Mar 10 '20 at 16:07
  • @DaveAbrahams Here, I've upvoted for you ;) – Omar Tariq Apr 10 '20 at 08:50
  • 2
    Amazing, thank you! the only thing that bothered me was the pixelated icon, but that is easy to fix, download an icon you like (for example from www.iconarchive.com) and inside the generated app package contents replace file Contents/Resources/app.icns – Boris Lopez Jun 02 '20 at 10:12
  • 2
    anybody know if there is a way to make chrome automatically launch links for this site as a window in the app? I set this up for google meets, which is great, but ideally I'd want google meets links I click in chrome to end up launching in the "app" – danielpops Jul 17 '20 at 01:25
  • This is great because it also keeps all your Chrome extensions enabled. Love it! – Nate Ritter Nov 05 '21 at 18:31
  • Any idea how to get OS notifications working with these shortcuts? I'm using it for Google Calendar and for me the notifications only appear on the window itself once it's active... – swenzel Nov 17 '21 at 08:03
  • “That's it - you now have an app” Where? – 2540625 Mar 12 '22 at 04:01
  • by default, these apps are saved in /Users//Applications/Chrome Browser apps (or something similar). Once you open the app, you can pin it to your taskbar for easy access. – Pyotr Li Mar 15 '22 at 09:58
  • Compared to some other methods for creating web apps, this ones allows the (some?) apps to run without internet! – Eric O. Lebigot Oct 19 '23 at 13:15
18

EASY, No software/installation required!

  • STEP 1: Simply navigate to the page you want to run/launch as a Web Application (e.g. https://www.gmail.com) using an existing or newly open Chrome tab/window.

  • STEP 2: Create the "Chrome Application" and OS level "shortcut"...

    1. Click on the hamburger/'three dots menu' button in the top far right of Chrome.

    2. Select 'More Tools ►'

    3. 'Add to Applications…' or 'Create Shortcut...' (has changed over time/versions)

    4. A small window will pop up - make changes to the Title as you like

    5. Check/Tick 'Open in (Separate) Window'

  • STEP 3: Using/Customizing Your "App"/ "Shortcut" / "Dock Icon":

    • The Shortcut should have been created in either (with the Finder automatically launching a new window open to the folder):

      1. the root of your "System Applications" folder (/Applications)... or...

      2. a subfolder for all Chrome Apps (probably /Applications/Chrome Apps)... or...

      3. the root of your "User Applications" folder (/Users/<your username>/Applications/Chrome Apps)

    • you will notice the .app extension on the folder name if you have enabled the "show extensions" setting for the Finder (Mac file explorer)

    • the "shortcut" itself acts like most other apps, i.e., Apps in MacOS (Since at least 2016) are actually special System FOLDERS...

    • however, by default when you CLICK on the folder in Finder (Mac's file explorer), it launches the app instead of actually entering/navigating into the folder.

    • to see the app's details, use RIGHT-CLICK > 'Show Package Contents' on the folder to enter/navigate/see its contents (e.g. <my app>/Content, <my app>/Content/Resources, etc.)

    • you can modify these subfolders to customize your App/Shortcut (i.e change the icon, customize the launch by modifying profiles, or opening with special (command-line) flags, etc..)

    • Move, copy, and use the shortcut anyway you'd like, using it like any other icon/shortcut on the desktop or Mac Dock

    • When using it in the dock, it should use its own "running indicator" separate from any other Chrome Apps or Chrome itself. However, it will still appear as a running window in the actual Chrome App Dock Icon.

NOTE: Since (at least) 2021-12-06, the following steps are unnecessary.

The following are included just to be thorough/complete, for backward compatibility, and for Troubleshooting purposes.

OPTIONAL STEPS / TROUBLESHOOTING:
(the following were needed on an earlier Chrome version, when these features/flags were not part of the stable build):

  1. (Re)Enable Chrome's feature to create OS level** [shortcuts to] "applications"

    • type chrome://flags in Chrome’s address bar.

    • find the following settings:

      1. The new bookmark app system

      2. Allow hosted apps to be opened in windows

      3. Creation of app shims for hosted apps on Mac

      4. Quit notification for hosted apps

    • Change/set these flag settings so that look like this (screenshot):

    enter image description here

  2. Restart Chrome

Flak DiNenno
  • 343
  • 1
    Didn't understand how to "Restart the Chrome (in the bottom of the page)". Also, the two folders you have specified in EITHER-OR are the same. Your solution worked for me so thanks. – CodePro_NotYet Jan 16 '19 at 04:43
  • 2
    This is awesome! – Danny G Jan 20 '19 at 18:49
  • @CodePro_NotYet I think I fixed it to make sense now. let me know. thx – Flak DiNenno Feb 01 '19 at 21:29
  • Absolutely awesome. Step 3 was more easy for me as Chrome opened the folder for me in Finder by itself, and I could easily drag the App to the Dock. Also, CMD+Q OR CMD+W will work separately in the App itself without effecting the whole Chrome. – Rehmat Feb 23 '19 at 06:28
  • @Rehmat I'm sorry... what do you mean CMD+Q or CMD-W... isn't that for Quitting an App or Closing a Tab (respectively). Oh... do you mean, since this new "App" is a "stand-alone" running Chrome window, you can close it using those shortcuts, without affecting any other Chrome Window or Tab? – Flak DiNenno Feb 23 '19 at 16:06
  • I don't know what disabling the creation of app shims does (third toggle above in chrome://flags). I left it enabled. It also works. – tvk Apr 28 '19 at 13:24
  • 5
    It seems that most of the guidance here is now stale; the answer from @Pyotr-Li now succinctly describes the solution. – Jason R. Coombs Jul 19 '19 at 13:06
  • Are these flags really required? Seemed to work out of the box for me. Considered deleting those from the answer or moving to the very bottom. – pkamb May 27 '20 at 22:09
  • @pkamb thanks for the advice... will do. – Flak DiNenno Dec 06 '21 at 15:13
  • @JasonR.Coombs it might be more succinct, but if you're new to Mac... my details are very very helpful... from what I've been told. – Flak DiNenno Dec 06 '21 at 15:16
  • “The Shortcut should have been created in either…” —Nope. – 2540625 Mar 12 '22 at 04:00
  • @2540625 the Shortcut never got created for you? Sometimes it gets created and/or actually opens/runs immediately. If it runs on the dock, then it had to get created somewhere... do you see any icon on the dock? – Flak DiNenno Mar 14 '22 at 16:45
  • @FlakDiNenno, I see no addition to my dock. No obvious addition to /Applications/ or ~/ either. – 2540625 Mar 29 '22 at 02:13
  • @2540625 not sure what's up... I see you commented on @pyotr's answer regarding the same... maybe try reinstalling chrome? but you should have an obvious App added to your /Applications (System Apps) or ~/Applications (User Apps) or the subfolder Chrome Apps in either – Flak DiNenno Mar 29 '22 at 17:36
5

Just found an awesome and apparently free solution: https://applicationize.me

It creates a chrome extension for your webapp, which enables you to launch the webapp just like a desktop app.

Mutual Exception
  • 619
5

It's WebKit rather than Chrome/Blink based, but Fluid is another way to achieve this.

Fluid

Turn any website into a real Mac app with Fluid

Web applications like Gmail, Facebook, Campfire and Pandora are becoming more and more like desktop applications every day. Running each of these web apps in a separate tab in your browser can be a real pain.

Fluid lets you create a Real Mac App (or "Fluid App") out of any website or web application, effectively turning your favorite web apps into OS X desktop apps.

https://fluidapp.com

pkamb
  • 8,791
calum_b
  • 5,921
  • 30
  • 37
3

This whole thread isn't up to date anymore. Google Chrome now supports this feature naturally:

  • Go to the website you want as an app
  • Just click the 3 dots > More Tools > Create shortcut..
  • then check Open as window and press "Create"

A finder window will pop up and show you the created .app file and opens it at once.

Bonus

You can change icons with command + i and just drag and drop a picture in .icns format.

Matthi _
  • 49
  • https://apple.stackexchange.com/a/363381/313842 Answered by Pytor Li. https://apple.stackexchange.com/a/329655/313842 Answered by Flak DiNenno. Please edit them to add more details if you wish. New answers should contain better info than others. – anki Dec 06 '19 at 15:48
  • Sorry I don't understand your answer. What should I edit? There are every information one needs. Nothing more. Nothing less... This thread is the first thing that shows up and the answer is outdated. Can I flag this in some way? This thread provides outdated information and no value anymore. Why downvote the only correct answer? – Matthi _ Dec 07 '19 at 23:13
  • The accepted answer might be outdated, but the other answers are still better. They contain what you just wrote. You just repeated those answers. Need examples? click on the links I gave or scroll up or down to find them. Now, you’ll see an edit button below those 2 answers. If you wish, use it and update the answers slightly. Please see [tour] also for a quick intro to how this site works. – anki Dec 08 '19 at 05:53
  • “A finder window will pop up“—Nope. – 2540625 Mar 12 '22 at 04:05
0

This is called progressive web apps. If the application has a relevant manifest.json file added while bundling then Chrome detects it and prompts if you want to install the web app as a shortcut to your OS which has a similar user experience to a native app. You can go to web.dev from your chrome browser to see how end result is.

Udhy
  • 6,697
milkersarac
  • 101
0

In 2023, macOS 14 Sonoma and Safari 17 added a new Safari web apps feature.

  1. In Safari, open the webpage that you want to use as a web app.

  2. From the menu bar, choose File > Add to Dock.

    Or click the Share button in the Safari toolbar, then choose Add to Dock.

This adds the website as a dedicated app icon in your Dock.

Use Safari web apps on Mac

Starting with macOS Sonoma, you can use Safari to save any webpage as a web app, so that you can use it independently of Safari. Web apps offer a streamlined, app-like experience and easy access from the Dock.

macOS Sonoma

Screengrab of the macOS Sonoma feature 'Use any website like an app.'

agarza
  • 2,274
pkamb
  • 8,791