diff --git a/web/styles/app_variables.css b/web/styles/app_variables.css
index 6a6ca2783e..af8409e059 100644
--- a/web/styles/app_variables.css
+++ b/web/styles/app_variables.css
@@ -282,12 +282,12 @@
     --color-tab-picker-icon: hsl(200deg 100% 40%);
 
     /* Reaction container colors */
-    --color-message-reaction-border: hsl(0deg 0% 0% / 12%);
-    --color-message-reaction-border-reacted: hsl(0deg 0% 0% / 40%);
+    --color-message-reaction-border: hsl(0deg 0% 0% / 10%);
+    --color-message-reaction-border-reacted: hsl(0deg 0% 0% / 45%);
     --color-message-reaction-background: hsl(0deg 0% 100%);
     --color-message-reaction-background-reacted: hsl(0deg 0% 100%);
     --color-message-reaction-background-hover: hsl(210deg 30% 96%);
-    --color-message-reaction-shadow-inner: hsl(210deg 50% 50% / 15%);
+    --color-message-reaction-shadow-inner: hsl(210deg 50% 50% / 8%);
     --color-message-reaction-text: hsl(210deg 20% 25% / 100%);
     --color-message-reaction-text-reacted: hsl(210deg 20% 20% / 100%);
     --color-message-reaction-button-text: hsl(210deg 20% 20% / 60%);
@@ -583,7 +583,7 @@
 
     /* Reaction container colors */
     --color-message-reaction-border: hsl(0deg 0% 100% / 15%);
-    --color-message-reaction-border-reacted: hsl(0deg 0% 100% / 50%);
+    --color-message-reaction-border-reacted: hsl(0deg 0% 100% / 70%);
     --color-message-reaction-background: hsl(0deg 0% 0% / 30%);
     --color-message-reaction-background-reacted: hsl(0deg 0% 0% / 80%);
     --color-message-reaction-background-hover: hsl(0deg 0% 100% / 10%);
diff --git a/web/styles/reactions.css b/web/styles/reactions.css
index 27cb3e883d..9d13b9fe95 100644
--- a/web/styles/reactions.css
+++ b/web/styles/reactions.css
@@ -4,7 +4,9 @@
 
     .message_reaction {
         display: flex;
-        padding: 1px 4px 1px 3px;
+        /* Set a pixel and half padding to maintain
+           pill height adjacent own reactions. */
+        padding: 1.5px 4px 1.5px 3px;
         box-sizing: border-box;
         min-width: 44px;
         cursor: pointer;
@@ -22,6 +24,13 @@
             color: var(--color-message-reaction-text-reacted);
             background-color: var(--color-message-reaction-background-reacted);
             border-color: var(--color-message-reaction-border-reacted);
+            /* Make this border thicker by half a pixel,
+               to make own reactions more prominent. */
+            border-width: 1.5px;
+            /* Reduce the padding top and bottom by half
+               a pixel accordingly, to maintain the same
+               pill height. */
+            padding: 1px 4px 1px 3px;
             font-weight: var(--font-weight-message-reaction);
             box-shadow: none;
         }
@@ -37,7 +46,9 @@
         + .reaction_button {
             visibility: hidden;
             pointer-events: none;
-            padding: 4px 6px;
+            /* Set top/bottom padding to accommodate borders
+               and padding around reaction pills. */
+            padding: 4.5px 6px;
             height: 13px;
             border-radius: 21px;
             color: var(--color-message-reaction-button-text);