diff --git a/res/css/views/rooms/_MessageComposer.pcss b/res/css/views/rooms/_MessageComposer.pcss
index 96673619e5..b5041fda6f 100644
--- a/res/css/views/rooms/_MessageComposer.pcss
+++ b/res/css/views/rooms/_MessageComposer.pcss
@@ -9,10 +9,14 @@ Please see LICENSE files in the repository root for full details.
 .mx_MessageComposer_wrapper {
     vertical-align: middle;
     margin: auto;
-    border-top: 1px solid $primary-hairline-color;
+    margin-left: 8px;
+    margin-right: 8px;
+    border: 1px solid $primary-hairline-color;
+    border-radius: 8px;
     position: relative;
-    padding-left: 42px;
+    padding-left: 50px;
     padding-right: 16px;
+    background-color: rgba(255, 255, 255, 0.05);
 }
 
 .mx_MessageComposer_replaced_wrapper {
@@ -71,15 +75,15 @@ Please see LICENSE files in the repository root for full details.
     width: 100%;
 }
 .mx_MessageComposer_e2eIconWrapper {
-    height: 12px; /* Match the height of the E2E icon for alignment */
+    height: 16px; /* Match the height of the E2E icon for alignment */
 }
 .mx_MessageComposer_e2eIcon.mx_E2EIcon {
     position: absolute;
     left: 20px;
     margin-right: 0; /* Counteract the E2EIcon class */
     margin-left: 3px; /* Counteract the E2EIcon class */
-    width: 12px;
-    height: 12px;
+    width: 16px;
+    height: 16px;
 }
 
 .mx_MessageComposer_noperm_error {