diff --git a/app/src/main/java/org/mozilla/fenix/components/toolbar/DefaultToolbarMenu.kt b/app/src/main/java/org/mozilla/fenix/components/toolbar/DefaultToolbarMenu.kt
index 860ef743f..cf673f3fa 100644
--- a/app/src/main/java/org/mozilla/fenix/components/toolbar/DefaultToolbarMenu.kt
+++ b/app/src/main/java/org/mozilla/fenix/components/toolbar/DefaultToolbarMenu.kt
@@ -5,11 +5,13 @@
 package org.mozilla.fenix.components.toolbar
 
 import android.content.Context
+import androidx.core.content.ContextCompat.getColor
 import androidx.lifecycle.LifecycleOwner
 import androidx.lifecycle.lifecycleScope
 import kotlinx.coroutines.Job
 import kotlinx.coroutines.launch
 import mozilla.components.browser.menu.BrowserMenuBuilder
+import mozilla.components.browser.menu.BrowserMenuHighlight
 import mozilla.components.browser.menu.item.BrowserMenuDivider
 import mozilla.components.browser.menu.item.BrowserMenuHighlightableItem
 import mozilla.components.browser.menu.item.BrowserMenuImageSwitch
@@ -177,7 +179,6 @@ class DefaultToolbarMenu(
         onItemTapped.invoke(ToolbarMenu.Item.Help)
     }
 
-    @Suppress("Deprecation")
     private val settings = BrowserMenuHighlightableItem(
         label = context.getString(R.string.browser_menu_settings),
         startImageResource = R.drawable.ic_settings,
@@ -187,10 +188,9 @@ class DefaultToolbarMenu(
         textColorResource = if (hasAccountProblem)
             R.color.sync_error_text_color else
             primaryTextColor(),
-        highlight = BrowserMenuHighlightableItem.Highlight(
+        highlight = BrowserMenuHighlight.HighPriority(
             endImageResource = R.drawable.ic_alert,
-            backgroundResource = R.drawable.sync_error_background_with_ripple,
-            colorResource = R.color.sync_error_background_color
+            backgroundTint = R.color.sync_error_background_color
         ),
         isHighlighted = { hasAccountProblem }
     ) {
@@ -213,10 +213,18 @@ class DefaultToolbarMenu(
         onItemTapped.invoke(ToolbarMenu.Item.RequestDesktop(checked))
     }
 
-    private val addToHomescreen = BrowserMenuImageText(
+    private val addToHomescreen = BrowserMenuHighlightableItem(
         label = context.getString(R.string.browser_menu_add_to_homescreen),
-        imageResource = R.drawable.ic_add_to_homescreen,
-        iconTintColorResource = primaryTextColor()
+        startImageResource = R.drawable.ic_add_to_homescreen,
+        iconTintColorResource = primaryTextColor(),
+        highlight = BrowserMenuHighlight.LowPriority(
+            label = context.getString(R.string.browser_menu_install_on_homescreen),
+            notificationTint = getColor(context, R.color.whats_new_notification_color)
+        ),
+        isHighlighted = {
+            val webAppUseCases = context.components.useCases.webAppUseCases
+            webAppUseCases.isPinningSupported() && webAppUseCases.isInstallable()
+        }
     ) {
         onItemTapped.invoke(ToolbarMenu.Item.AddToHomeScreen)
     }
diff --git a/app/src/main/java/org/mozilla/fenix/components/toolbar/MenuPresenter.kt b/app/src/main/java/org/mozilla/fenix/components/toolbar/MenuPresenter.kt
index 8bd4d9d6d..ec5404a99 100644
--- a/app/src/main/java/org/mozilla/fenix/components/toolbar/MenuPresenter.kt
+++ b/app/src/main/java/org/mozilla/fenix/components/toolbar/MenuPresenter.kt
@@ -8,6 +8,7 @@ import mozilla.components.browser.session.SelectionAwareSessionObserver
 import mozilla.components.browser.session.Session
 import mozilla.components.browser.session.SessionManager
 import mozilla.components.browser.toolbar.BrowserToolbar
+import mozilla.components.concept.engine.manifest.WebAppManifest
 
 class MenuPresenter(
     private val menuToolbar: BrowserToolbar,
@@ -28,4 +29,9 @@ class MenuPresenter(
     override fun onNavigationStateChanged(session: Session, canGoBack: Boolean, canGoForward: Boolean) {
         menuToolbar.invalidateActions()
     }
+
+    /** Redraw the install web app button */
+    override fun onWebAppManifestChanged(session: Session, manifest: WebAppManifest?) {
+        menuToolbar.invalidateActions()
+    }
 }
diff --git a/app/src/main/java/org/mozilla/fenix/home/HomeMenu.kt b/app/src/main/java/org/mozilla/fenix/home/HomeMenu.kt
index d82ee45f1..cfedc3779 100644
--- a/app/src/main/java/org/mozilla/fenix/home/HomeMenu.kt
+++ b/app/src/main/java/org/mozilla/fenix/home/HomeMenu.kt
@@ -5,7 +5,9 @@
 package org.mozilla.fenix.home
 
 import android.content.Context
+import androidx.core.content.ContextCompat.getColor
 import mozilla.components.browser.menu.BrowserMenuBuilder
+import mozilla.components.browser.menu.BrowserMenuHighlight
 import mozilla.components.browser.menu.item.BrowserMenuCategory
 import mozilla.components.browser.menu.item.BrowserMenuDivider
 import mozilla.components.browser.menu.item.BrowserMenuHighlightableItem
@@ -64,7 +66,6 @@ class HomeMenu(
 
             BrowserMenuDivider(),
 
-            @Suppress("Deprecation")
             BrowserMenuHighlightableItem(
                 label = context.getString(R.string.browser_menu_settings),
                 startImageResource = R.drawable.ic_settings,
@@ -72,27 +73,22 @@ class HomeMenu(
                     if (hasAccountProblem) R.color.sync_error_text_color else primaryTextColor,
                 textColorResource =
                     if (hasAccountProblem) R.color.sync_error_text_color else primaryTextColor,
-                highlight = BrowserMenuHighlightableItem.Highlight(
+
+                highlight = BrowserMenuHighlight.HighPriority(
                     endImageResource = R.drawable.ic_alert,
-                    backgroundResource = R.drawable.sync_error_background_with_ripple,
-                    colorResource = R.color.sync_error_background_color
+                    backgroundTint = getColor(context, R.color.sync_error_background_color)
                 ),
                 isHighlighted = { hasAccountProblem }
             ) {
                 onItemTapped.invoke(Item.Settings)
             },
 
-            @Suppress("Deprecation")
             BrowserMenuHighlightableItem(
                 context.getString(R.string.browser_menu_whats_new),
                 R.drawable.ic_whats_new,
-                highlight = BrowserMenuHighlightableItem.Highlight(
-                    startImageResource = R.drawable.ic_whats_new_notification,
-                    backgroundResource = ThemeManager.resolveAttribute(
-                        R.attr.selectableItemBackground,
-                        context
-                    ),
-                    colorResource = R.color.whats_new_notification_color
+                iconTintColorResource = primaryTextColor,
+                highlight = BrowserMenuHighlight.LowPriority(
+                    notificationTint = getColor(context, R.color.whats_new_notification_color)
                 ),
                 isHighlighted = { WhatsNew.shouldHighlightWhatsNew(context) }
             ) {
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 23df7836c..fafb915a2 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -76,6 +76,8 @@
     <string name="browser_menu_desktop_site">Desktop site</string>
     <!-- Browser menu toggle that adds a shortcut to the site on the device home screen. -->
     <string name="browser_menu_add_to_homescreen">Add to Home screen</string>
+    <!-- Browser menu toggle that installs a Progressive Web App shortcut to the site on the device home screen. -->
+    <string name="browser_menu_install_on_homescreen">Install</string>
     <!-- Browser menu button that opens the find in page menu -->
     <string name="browser_menu_find_in_page">Find in page</string>
     <!-- Browser menu button that creates a private tab -->