diff --git a/web/styles/tooltips.css b/web/styles/tooltips.css
index 2e9b3d6b90..22b976d556 100644
--- a/web/styles/tooltips.css
+++ b/web/styles/tooltips.css
@@ -12,7 +12,10 @@
     .tippy-box:not([data-theme]) {
         background: hsl(0deg 0% 20%);
         border-radius: 5px;
-        min-height: 25px;
+        /* 14px at 14px/1em */
+        font-size: 1em;
+        /* 25px at 14px/1em */
+        min-height: 1.7857em;
         box-sizing: border-box;
 
         .tippy-content {
@@ -20,8 +23,10 @@
             display: flex;
             align-items: center;
             padding: 5px 10px;
-            font-size: 14px;
-            line-height: 20px;
+            /* 14px at 14px/1em */
+            font-size: 1em;
+            /* 20px at 14px/1em */
+            line-height: 1.4286em;
             color: hsl(0deg 0% 100%);
         }
 
@@ -34,7 +39,8 @@
         }
 
         .tooltip-inner-content {
-            line-height: 17px;
+            /* 17px at 14px/1em */
+            line-height: 1.2143em;
         }
 
         &[data-placement^="top"] > .tippy-arrow::before {
diff --git a/web/styles/zulip.css b/web/styles/zulip.css
index 59aaca870c..8e9077a44b 100644
--- a/web/styles/zulip.css
+++ b/web/styles/zulip.css
@@ -779,7 +779,8 @@ strong {
 .buddy_list_tooltip_content {
     text-align: left;
     word-wrap: break-word;
-    max-width: 280px;
+    /* 280px at 14px/1em */
+    max-width: 20em;
 }
 
 #change_visibility_policy_button_tooltip {