diff --git a/src/components/ColorPicker.scss b/src/components/ColorPicker.scss
index 52ea20a195..b816b25536 100644
--- a/src/components/ColorPicker.scss
+++ b/src/components/ColorPicker.scss
@@ -183,6 +183,7 @@
     width: 100%;
     margin: 0;
     font-size: 0.875rem;
+    font-family: inherit;
     background-color: transparent;
     color: var(--text-primary-color);
     border: 0;
diff --git a/src/components/ContextMenu.scss b/src/components/ContextMenu.scss
index 5797631196..81ced38807 100644
--- a/src/components/ContextMenu.scss
+++ b/src/components/ContextMenu.scss
@@ -30,6 +30,7 @@
     background-color: transparent;
     border: none;
     white-space: nowrap;
+    font-family: inherit;
 
     display: grid;
     grid-template-columns: 1fr 0.2fr;
diff --git a/src/components/Tooltip.scss b/src/components/Tooltip.scss
index bb2b2f72e6..490e255780 100644
--- a/src/components/Tooltip.scss
+++ b/src/components/Tooltip.scss
@@ -2,6 +2,9 @@
 
 // container in body where the actual tooltip is appended to
 .excalidraw-tooltip {
+  --ui-font: Assistant, system-ui, BlinkMacSystemFont, -apple-system, Segoe UI,
+    Roboto, Helvetica, Arial, sans-serif;
+  font-family: var(--ui-font);
   position: fixed;
   z-index: 1000;
 
diff --git a/src/css/styles.scss b/src/css/styles.scss
index 8dafbfbdfa..29e52011e7 100644
--- a/src/css/styles.scss
+++ b/src/css/styles.scss
@@ -354,6 +354,7 @@
     border-radius: var(--space-factor);
     border: 1px solid var(--button-gray-2);
     font-size: 0.8rem;
+    font-family: inherit;
     outline: none;
     appearance: none;
     background-image: var(--dropdown-icon);
@@ -413,6 +414,7 @@
     bottom: 30px;
     transform: translateX(-50%);
     pointer-events: all;
+    font-family: inherit;
 
     &:hover {
       background-color: var(--button-hover-bg);