diff --git a/css/styles.css b/css/styles.css
index d70cf72..ca7ab1e 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -25,7 +25,7 @@
 html,
 body {
     height: 100%;
-    font-family: 'Caveat', cursive;
+    font-family: 'Open Sans', sans-serif;
     background-color: var(--bg-primary);
     color: var(--text-primary);
 }
@@ -69,7 +69,7 @@ body {
 }
 
 .chart-title {
-    font-family: 'Caveat', cursive;
+    font-family: 'Open Sans', sans-serif;
     font-size: 2.2rem;
     font-weight: 700;
     background: transparent;
@@ -96,7 +96,7 @@ body {
 
 /* Buttons */
 .btn {
-    font-family: 'Caveat', cursive;
+    font-family: 'Open Sans', sans-serif;
     padding: 10px 18px;
     border: 2px solid currentColor;
     border-radius: 4px;
@@ -178,7 +178,7 @@ body {
 
 /* Hill Labels */
 .hill-label {
-    font-family: 'Caveat', cursive;
+    font-family: 'Open Sans', sans-serif;
     fill: var(--text-secondary);
     font-size: 22px;
     font-style: italic;
@@ -203,7 +203,7 @@ body {
 }
 
 .scope-label {
-    font-family: 'Caveat', cursive;
+    font-family: 'Open Sans', sans-serif;
     fill: var(--text-primary);
     font-size: 22px;
     font-weight: 700;
@@ -250,14 +250,14 @@ body {
 }
 
 .modal h2 {
-    font-family: 'Caveat', cursive;
+    font-family: 'Open Sans', sans-serif;
     margin-bottom: 16px;
     font-size: 1.8rem;
     font-weight: 700;
 }
 
 .modal input {
-    font-family: 'Caveat', cursive;
+    font-family: 'Open Sans', sans-serif;
     width: 100%;
     padding: 12px 14px;
     border: 2px solid var(--border-color);
diff --git a/index.html b/index.html
index 2bf0cda..a268814 100644
--- a/index.html
+++ b/index.html
@@ -10,6 +10,9 @@
     <meta name="keywords" content="hill chart, shape up, project management, basecamp, progress tracking">
     <meta name="robots" content="index, follow">
     <link rel="canonical" href="https://jamers99.github.io/hillchart/">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet">
     <script src="js/font-data.js"></script>
     <link rel="stylesheet" href="css/styles.css">
 </head>