diff --git a/css/leptonChrome.css b/css/leptonChrome.css
index 391ac11..d960653 100644
--- a/css/leptonChrome.css
+++ b/css/leptonChrome.css
@@ -184,6 +184,15 @@
   :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon {
     fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1);
   }
+  /*= Tabpreviw transparent #890 ===============================================*/
+  #tab-preview-panel {
+    --panel-background: var(
+      --arrowpanel-background
+    ) !important; /* Original: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)) */
+    --panel-color: var(
+      --arrowpanel-color
+    ) !important; /* Original: var(--tab-selected-textcolor, var(--toolbar-color)) */
+  }
 }
 /*= OS - Compatibility =======================================================*/
 @supports -moz-bool-pref("userChrome.compatibility.os") {
@@ -13599,6 +13608,7 @@
   /*= Menubar rounding #814 ====================================================*/
   /*= Infobar Align #858 =======================================================*/
   /*= Inactive transparent #882 ================================================*/
+  /*= Tabpreviw transparent #890 ===============================================*/
 }
 @media (-moz-bool-pref: "userChrome.compatibility.theme") and (-moz-bool-pref: "userChrome.tab.connect_to_window") {
   /* TARGET: original, photon */
@@ -13730,6 +13740,16 @@
     fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1);
   }
 }
+@media (-moz-bool-pref: "userChrome.compatibility.theme") {
+  #tab-preview-panel {
+    --panel-background: var(
+      --arrowpanel-background
+    ) !important; /* Original: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)) */
+    --panel-color: var(
+      --arrowpanel-color
+    ) !important; /* Original: var(--tab-selected-textcolor, var(--toolbar-color)) */
+  }
+}
 /*= OS - Compatibility =======================================================*/
 @media (-moz-bool-pref: "userChrome.compatibility.os") {
   /*= Windows 10 - Top border of accent color at ESR #358 ======================*/
diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css
index beeea57..6c05079 100644
--- a/css/leptonChromeESR.css
+++ b/css/leptonChromeESR.css
@@ -184,6 +184,15 @@
   :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon {
     fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1);
   }
+  /*= Tabpreviw transparent #890 ===============================================*/
+  #tab-preview-panel {
+    --panel-background: var(
+      --arrowpanel-background
+    ) !important; /* Original: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)) */
+    --panel-color: var(
+      --arrowpanel-color
+    ) !important; /* Original: var(--tab-selected-textcolor, var(--toolbar-color)) */
+  }
 }
 /*= OS - Compatibility =======================================================*/
 @supports -moz-bool-pref("userChrome.compatibility.os") {
diff --git a/src/compatibility/_theme.scss b/src/compatibility/_theme.scss
index bd0d991..2cb8861 100644
--- a/src/compatibility/_theme.scss
+++ b/src/compatibility/_theme.scss
@@ -193,3 +193,9 @@ vbox[part="drop-indicator-bar"] > image[part="drop-indicator"] {
     fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1);
   }
 }
+
+/*= Tabpreviw transparent #890 ===============================================*/
+#tab-preview-panel {
+  --panel-background: var(--arrowpanel-background) !important; /* Original: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)) */
+  --panel-color: var(--arrowpanel-color) !important; /* Original: var(--tab-selected-textcolor, var(--toolbar-color)) */
+}