diff --git a/ui/_locales/en/messages.json b/ui/_locales/en/messages.json
index d9fd7129ef..9f3f5ccda1 100644
--- a/ui/_locales/en/messages.json
+++ b/ui/_locales/en/messages.json
@@ -340,6 +340,7 @@
     "networksBanner": "Not seeing NFTs from all your networks? Activate a network by switching to it on the Wallet tab.",
     "filters": {
       "title": "Filter collections",
+      "tooltip": "Filter",
       "warning": "Changing filters here will affect your Portfolio page as well.",
       "sortType": {
         "priceDesc": "Floor price: Descending",
@@ -620,6 +621,7 @@
     "connectedWebsitesSettings": {
       "title": "Connected websites",
       "disconnected": "Website disconnected",
+      "disconnectTooltip": "Disconnect website",
       "ariaLabel": "Manage connected websites",
       "emptyList": "Not connected to any websites"
     },
@@ -804,6 +806,7 @@
   },
   "topMenu": {
     "showCurrentDappConnection": "Show current website connection",
+    "currentDappConnection": "Current website connection",
     "connectToWebsiteUsing": "Connect to website using:",
     "setTahoAsDefault": "Set Taho as default",
     "setOtherAsDefault": "Set MetaMask/other wallet as default",
@@ -818,6 +821,7 @@
     "connectedDappInfo": {
       "dAppTitle": "Account connected to",
       "dappConnections": "Website connections",
+      "disconnectDapp": "Disconnect Dapp",
       "guideline": {
         "title": "How to connect to websites",
         "step1": "Connect using Taho",
@@ -963,7 +967,7 @@
       "submitSpamBtn": "Yes, report & delete",
       "snackbar": "Ability deleted"
     },
-    "filter": {
+    "filters": {
       "title": "Filter Abilities",
       "tooltip": "Filter",
       "abilityState": {
diff --git a/ui/_locales/es/messages.json b/ui/_locales/es/messages.json
index f2f7b179cc..1c21ada337 100644
--- a/ui/_locales/es/messages.json
+++ b/ui/_locales/es/messages.json
@@ -68,10 +68,11 @@
     "bugReport": "Informe de errores",
     "connectedWebsites": "Sitios Web a los que está conectado",
     "connectedWebsitesSettings": {
-      "ariaLabel": "Administrar sitios web conectados",
+      "title": "Sitios web a los que está conectado",
       "disconnected": "Sitios web desconectados",
-      "emptyList": "No está conectado a ningún sitio web",
-      "title": "Sitios web a los que está conectado"
+      "disconnectTooltip": "Desconectar sitios web",
+      "ariaLabel": "Administrar sitios web conectados",
+      "emptyList": "No está conectado a ningún sitio web"
     },
     "enableTestNetworks": "Habilitar redes de prueba",
     "exportLogs": {
diff --git a/ui/_locales/zh_Hant/messages.json b/ui/_locales/zh_Hant/messages.json
index ef99c67258..1b840e9055 100644
--- a/ui/_locales/zh_Hant/messages.json
+++ b/ui/_locales/zh_Hant/messages.json
@@ -69,10 +69,11 @@
     "bugReport": "問題回報",
     "connectedWebsites": "已連結的網站",
     "connectedWebsitesSettings": {
-      "ariaLabel": "管理已連結的網站",
+      "title": "已連結的網站",
       "disconnected": "網站已斷開",
-      "emptyList": "尚未與任何網站連結",
-      "title": "已連結的網站"
+      "disconnectTooltip": "斷開網站連接",
+      "ariaLabel": "管理已連結的網站",
+      "emptyList": "尚未與任何網站連結"
     },
     "enableTestNetworks": "啟用測試網路",
     "exportLogs": {
diff --git a/ui/components/DAppConnection/ActiveDAppConnection.tsx b/ui/components/DAppConnection/ActiveDAppConnection.tsx
index 45e357442e..5113712150 100644
--- a/ui/components/DAppConnection/ActiveDAppConnection.tsx
+++ b/ui/components/DAppConnection/ActiveDAppConnection.tsx
@@ -4,6 +4,7 @@ import React, { ReactElement, useCallback, useState } from "react"
 import { useTranslation } from "react-i18next"
 import { useBackgroundDispatch } from "../../hooks"
 import TopMenuConnectedDAppInfo from "../TopMenu/TopMenuConnectedDAppInfo"
+import SharedTooltip from "../Shared/SharedTooltip"
 
 type Props = {
   isConnectedToDApp: boolean
@@ -54,16 +55,29 @@ export default function ActiveDAppConnection({
           isConnected={isConnectedToDApp}
         />
       ) : null}
-      <button
-        type="button"
-        aria-label={t("showCurrentDappConnection")}
-        className="connection_button"
-        onClick={() => {
-          setIsActiveDAppConnectionInfoOpen(!isActiveDAppConnectionInfoOpen)
-        }}
+      <SharedTooltip
+        type="dark"
+        width={160}
+        horizontalShift={160}
+        verticalShift={-15}
+        verticalPosition="bottom"
+        horizontalPosition="left"
+        IconComponent={() => (
+          <button
+            type="button"
+            aria-label={t("showCurrentDappConnection")}
+            className="connection_button"
+            onClick={() => {
+              setIsActiveDAppConnectionInfoOpen(!isActiveDAppConnectionInfoOpen)
+            }}
+          >
+            <div className="connection_img" />
+          </button>
+        )}
       >
-        <div className="connection_img" />
-      </button>
+        {t("currentDappConnection")}
+      </SharedTooltip>
+
       <style jsx>{`
         .connection_button {
           width: 32px;
diff --git a/ui/components/NFTs/NFTsHeader.tsx b/ui/components/NFTs/NFTsHeader.tsx
index 4b0f1a9384..67c0e403c4 100644
--- a/ui/components/NFTs/NFTsHeader.tsx
+++ b/ui/components/NFTs/NFTsHeader.tsx
@@ -12,9 +12,9 @@ import {
 import SharedLoadingSpinner from "../Shared/SharedLoadingSpinner"
 import { HeaderContainer, EmptyHeader } from "./NFTsHeaderBase"
 import { useBackgroundSelector, useTotalNFTsFloorPrice } from "../../hooks"
-import SharedIcon from "../Shared/SharedIcon"
 import SharedSlideUpMenu from "../Shared/SharedSlideUpMenu"
 import NFTsFilters from "./Filters/NFTsFilters"
+import SharedFilterTooltip from "../Shared/SharedFilterTooltip"
 
 export default function NFTsHeader(): ReactElement {
   const { t } = useTranslation("translation", {
@@ -60,17 +60,11 @@ export default function NFTsHeader(): ReactElement {
         <div className="stats_container">
           <div className="stats_title">{t("header.title")}</div>
           {allNftCount > 0 && (
-            <div className="filters_container">
-              <SharedIcon
-                width={24}
-                icon="toggle.svg"
-                ariaLabel={t("filters.title")}
-                color="var(--green-40)"
-                hoverColor="var(--green-20)"
-                onClick={handleToggleClick}
-                disabled={isLoading}
-              />
-            </div>
+            <SharedFilterTooltip
+              keyPrefix="nfts"
+              isOpen={openFiltersMenu}
+              setIsOpen={setOpenFiltersMenu}
+            />
           )}
           <div className="stats_totals">
             <span className="currency_sign">{mainCurrencySign}</span>
@@ -123,13 +117,6 @@ export default function NFTsHeader(): ReactElement {
           color: var(--green-20);
         }
 
-        .filters_container {
-          position: absolute;
-          width: 90vw;
-          display: flex;
-          justify-content: end;
-        }
-
         .stats_spinner {
           position: absolute;
           right: -25px;
diff --git a/ui/components/Shared/SharedFilterTooltip.tsx b/ui/components/Shared/SharedFilterTooltip.tsx
new file mode 100644
index 0000000000..dd22e689f8
--- /dev/null
+++ b/ui/components/Shared/SharedFilterTooltip.tsx
@@ -0,0 +1,60 @@
+import React, { Dispatch, SetStateAction, useCallback } from "react"
+import { KeyPrefix, useTranslation } from "react-i18next"
+import SharedTooltip from "./SharedTooltip"
+import SharedIcon from "./SharedIcon"
+
+type SharedFilterTooltipProps = {
+  keyPrefix: KeyPrefix<"translation">
+  isOpen: boolean
+  setIsOpen: Dispatch<SetStateAction<boolean>>
+}
+
+export default function SharedFilterTooltip({
+  keyPrefix,
+  isOpen,
+  setIsOpen,
+}: SharedFilterTooltipProps) {
+  const { t } = useTranslation("translation", {
+    keyPrefix,
+  })
+
+  const handleToggleClick = useCallback(() => {
+    setIsOpen((currentlyOpen) => !currentlyOpen)
+  }, [setIsOpen])
+
+  return (
+    <>
+      <div className="filters_container">
+        <SharedTooltip
+          width={36}
+          height={32}
+          verticalPosition="bottom"
+          horizontalPosition="center"
+          horizontalShift={8}
+          type="dark"
+          isOpen={isOpen}
+          IconComponent={() => (
+            <SharedIcon
+              width={24}
+              icon="toggle.svg"
+              ariaLabel={t("filters.title")}
+              color="var(--green-40)"
+              hoverColor="var(--green-20)"
+              onClick={handleToggleClick}
+            />
+          )}
+        >
+          {t("filters.tooltip")}
+        </SharedTooltip>
+      </div>
+      <style jsx>{`
+        .filters_container {
+          position: absolute;
+          width: 90vw;
+          display: flex;
+          justify-content: end;
+        }
+      `}</style>
+    </>
+  )
+}
diff --git a/ui/components/Shared/SharedIconRouterLink.tsx b/ui/components/Shared/SharedIconRouterLink.tsx
index 1f8b7df199..516162c83b 100644
--- a/ui/components/Shared/SharedIconRouterLink.tsx
+++ b/ui/components/Shared/SharedIconRouterLink.tsx
@@ -1,15 +1,18 @@
 import React, { ReactElement } from "react"
 import { Link } from "react-router-dom"
+import SharedTooltip from "./SharedTooltip"
 
 type Props = {
   path: string
   state: { [key: string]: unknown }
   iconClass: string
   disabled?: boolean
+  isTooltip?: boolean
+  tooltipText?: string
 }
 
 export default function SharedIconRouterLink(props: Props): ReactElement {
-  const { path, state, iconClass, disabled } = props
+  const { path, state, iconClass, disabled, isTooltip, tooltipText } = props
 
   if (disabled) {
     return (
@@ -28,16 +31,33 @@ export default function SharedIconRouterLink(props: Props): ReactElement {
   }
 
   return (
-    <Link
-      to={{
-        pathname: path,
-        state,
-      }}
-      className="router_link_container"
-    >
-      <div className="icon_wrapper">
-        <i className={`asset_icon hoverable ${iconClass}`} />
-      </div>
+    <>
+      {isTooltip && tooltipText ? (
+        <SharedTooltip
+          type="dark"
+          horizontalPosition="center"
+          verticalPosition="top"
+          verticalShift={-10}
+          IconComponent={() => (
+            <Link
+              to={{ pathname: path, state }}
+              className="router_link_container"
+            >
+              <div className="icon_wrapper">
+                <i className={`asset_icon hoverable ${iconClass}`} />
+              </div>
+            </Link>
+          )}
+        >
+          {tooltipText}
+        </SharedTooltip>
+      ) : (
+        <Link to={{ pathname: path, state }} className="router_link_container">
+          <div className="icon_wrapper">
+            <i className={`asset_icon hoverable ${iconClass}`} />
+          </div>
+        </Link>
+      )}
       <style jsx global>{`
         .router_link_container {
           margin: auto 4px;
@@ -46,6 +66,7 @@ export default function SharedIconRouterLink(props: Props): ReactElement {
         .icon_wrapper {
           display: flex;
           padding: 0.5em;
+          border-radius: 4px;
         }
         .disabled_asset_icon {
           mask-size: cover;
@@ -53,7 +74,7 @@ export default function SharedIconRouterLink(props: Props): ReactElement {
           width: 12px;
           height: 12px;
         }
-        .router_link_container:hover {
+        .router_link_container:hover .icon_wrapper {
           background-color: var(--hunter-green);
           color: var(--trophy-gold);
         }
@@ -61,6 +82,6 @@ export default function SharedIconRouterLink(props: Props): ReactElement {
           background-color: var(--trophy-gold);
         }
       `}</style>
-    </Link>
+    </>
   )
 }
diff --git a/ui/components/TopMenu/TopMenuConnectedDAppInfo.tsx b/ui/components/TopMenu/TopMenuConnectedDAppInfo.tsx
index e5c50c20d1..13f32b33fd 100644
--- a/ui/components/TopMenu/TopMenuConnectedDAppInfo.tsx
+++ b/ui/components/TopMenu/TopMenuConnectedDAppInfo.tsx
@@ -6,6 +6,7 @@ import DAppConnectionDefaultToggle from "../DAppConnection/DAppConnectionDefault
 import SharedAccordion from "../Shared/SharedAccordion"
 import SharedLink from "../Shared/SharedLink"
 import SharedPanelSwitcher from "../Shared/SharedPanelSwitcher"
+import SharedTooltip from "../Shared/SharedTooltip"
 
 function ConnectionDAppGuideline({
   isConnected,
@@ -245,12 +246,23 @@ export default function TopMenuConnectedDAppInfo(props: {
             <div className="url text ellipsis" title={url}>
               {url}
             </div>
-            <button
-              aria-label="disconnect"
-              type="button"
-              className="disconnect_icon"
-              onClick={disconnect}
-            />
+            <SharedTooltip
+              width={120}
+              verticalPosition="bottom"
+              horizontalPosition="center"
+              verticalShift={-20}
+              type="dark"
+              IconComponent={() => (
+                <button
+                  aria-label="disconnect"
+                  type="button"
+                  className="disconnect_icon"
+                  onClick={disconnect}
+                />
+              )}
+            >
+              {t("disconnectDapp")}
+            </SharedTooltip>
           </div>
         </div>
         <ConnectionDAppGuideline isConnected={isConnected} />
@@ -351,7 +363,7 @@ export default function TopMenuConnectedDAppInfo(props: {
           background-size: cover;
           width: 16px;
           height: 18px;
-          margin: 16px 0 32px;
+          margin: 16px 0 40px;
         }
         .dAppInfo_wrap {
           width: 100%;
diff --git a/ui/components/Wallet/AssetListItem/CommonAssetListItem.tsx b/ui/components/Wallet/AssetListItem/CommonAssetListItem.tsx
index b5fa82fc40..725d4a40d7 100644
--- a/ui/components/Wallet/AssetListItem/CommonAssetListItem.tsx
+++ b/ui/components/Wallet/AssetListItem/CommonAssetListItem.tsx
@@ -122,6 +122,8 @@ export default function CommonAssetListItem(
                 path="/send"
                 state={assetAmount.asset}
                 iconClass="asset_icon_send"
+                isTooltip
+                tooltipText="Send"
               />
               {NETWORKS_SUPPORTING_SWAPS.has(selectedNetwork.chainID) ? (
                 <SharedIconRouterLink
@@ -131,6 +133,8 @@ export default function CommonAssetListItem(
                     contractAddress,
                   }}
                   iconClass="asset_icon_swap"
+                  isTooltip
+                  tooltipText="Swap"
                 />
               ) : (
                 <SharedTooltip
diff --git a/ui/pages/Abilities.tsx b/ui/pages/Abilities.tsx
index 210c9f5482..7d4558da5a 100644
--- a/ui/pages/Abilities.tsx
+++ b/ui/pages/Abilities.tsx
@@ -4,11 +4,10 @@ import { useTranslation } from "react-i18next"
 import SharedButton from "../components/Shared/SharedButton"
 import AbilityCard from "./Abilities/AbilityCard"
 import { useBackgroundSelector } from "../hooks"
-import SharedIcon from "../components/Shared/SharedIcon"
-import SharedTooltip from "../components/Shared/SharedTooltip"
 import SharedSlideUpMenu from "../components/Shared/SharedSlideUpMenu"
 import AbilityFilter from "./Abilities/AbilityFilter"
 import { ONBOARDING_ROOT } from "./Onboarding/Tabbed/Routes"
+import SharedFilterTooltip from "../components/Shared/SharedFilterTooltip"
 
 export default function Abilities(): ReactElement {
   const { t } = useTranslation("translation", {
@@ -30,29 +29,11 @@ export default function Abilities(): ReactElement {
         <div className="header">
           <div className="icon_tail logo" />
           <h1>{t("header")}</h1>
-          <div className="filters_container">
-            <SharedTooltip
-              width={36}
-              height={32}
-              verticalPosition="bottom"
-              horizontalPosition="center"
-              horizontalShift={8}
-              type="dark"
-              isOpen={openFilterMenu}
-              IconComponent={() => (
-                <SharedIcon
-                  width={24}
-                  icon="toggle.svg"
-                  ariaLabel={t("filter.title")}
-                  color="var(--green-40)"
-                  hoverColor="var(--green-20)"
-                  onClick={handleToggleClick}
-                />
-              )}
-            >
-              {t("filter.tooltip")}
-            </SharedTooltip>
-          </div>
+          <SharedFilterTooltip
+            keyPrefix="abilities"
+            isOpen={openFilterMenu}
+            setIsOpen={setOpenFilterMenu}
+          />
         </div>
         {abilities.length > 0 ? (
           abilities.map((ability, id) => {
@@ -91,12 +72,6 @@ export default function Abilities(): ReactElement {
             font-size: 22px;
             line-height: 32px;
           }
-          .filters_container {
-            position: absolute;
-            width: 90vw;
-            display: flex;
-            justify-content: end;
-          }
           section {
             height: 544px;
             width: 100%;
diff --git a/ui/pages/Abilities/AbilityFilter.tsx b/ui/pages/Abilities/AbilityFilter.tsx
index cda24daef3..4a794d56ed 100644
--- a/ui/pages/Abilities/AbilityFilter.tsx
+++ b/ui/pages/Abilities/AbilityFilter.tsx
@@ -25,7 +25,7 @@ import { i18n } from "../../_locales/i18n"
 import AbilityFilterCard from "./AbilityFilterCard"
 
 const RADIO_NAME = "sortType"
-const KEY_PREFIX = "abilities.filter"
+const KEY_PREFIX = "abilities.filters"
 
 const RADIO_BTNS: { value: State; label: string }[] = [
   {
@@ -65,7 +65,7 @@ const ABILITY_TYPE_DESC = {
 
 export default function AbilityFilter(): ReactElement {
   const { t } = useTranslation("translation", {
-    keyPrefix: "abilities.filter",
+    keyPrefix: "abilities.filters",
   })
   const state = useBackgroundSelector(selectAbilityFilterState)
   const types = useBackgroundSelector(selectAbilityFilterTypes)