diff --git a/app/assets/stylesheets/common/foundation/base.scss b/app/assets/stylesheets/common/foundation/base.scss
index 972e2f7ac7c..53cf91eb543 100644
--- a/app/assets/stylesheets/common/foundation/base.scss
+++ b/app/assets/stylesheets/common/foundation/base.scss
@@ -4,8 +4,13 @@
 
 html {
   color: var(--primary);
-  font-family: $base-font-family;
   font-size: $base-font-size;
+  // This is intentionally set after the font-size, but before font-family
+  @supports (font: -apple-system-body) and (-webkit-touch-callout: none) {
+    // only applied to iOS devices
+    font: -apple-system-body;
+  }
+  font-family: $base-font-family;
   line-height: $line-height-large;
   background-color: var(--secondary);
   overflow-y: scroll;