diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_AppsDrawer.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_AppsDrawer.scss
index 7fe2b03cf4..7af2d25adc 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_AppsDrawer.scss
+++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_AppsDrawer.scss
@@ -81,6 +81,11 @@ limitations under the License.
     // background-color: $e2e-verified-color;
     border-bottom: 1px solid $primary-hairline-color;
     font-size: 10px;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    background-color: $widget-menu-bar-bg-color;
 }
 
 .mx_AppTileMenuBarWidgets {
diff --git a/src/skins/vector/css/themes/_base.scss b/src/skins/vector/css/themes/_base.scss
index 3a7eac5627..d6417e58fa 100644
--- a/src/skins/vector/css/themes/_base.scss
+++ b/src/skins/vector/css/themes/_base.scss
@@ -101,6 +101,10 @@ $roomsublist-label-bg-color: #d3efe1;
 
 // ********************
 
+$widget-menu-bar-bg-color: #d3efe1;
+
+// ********************
+
 // event tile lifecycle
 $event-encrypting-color: #abddbc;
 $event-sending-color: #ddd;
diff --git a/src/skins/vector/css/themes/_dark.scss b/src/skins/vector/css/themes/_dark.scss
index d6fa88d6ce..b6eaab4a83 100644
--- a/src/skins/vector/css/themes/_dark.scss
+++ b/src/skins/vector/css/themes/_dark.scss
@@ -95,6 +95,10 @@ $roomsublist-label-bg-color: #454545;
 
 // ********************
 
+$widget-menu-bar-bg-color: #454545;
+
+// ********************
+
 // event tile lifecycle
 $event-encrypting-color: rgba(171, 221, 188, 0.4);
 $event-sending-color: #888;