diff --git a/client/package.json b/client/package.json
index 90db39014..6e09a260e 100644
--- a/client/package.json
+++ b/client/package.json
@@ -22,6 +22,7 @@
     "react-scripts": "4.0.3",
     "socket.io-client": "^4.0.1",
     "tinykeys": "^1.1.2",
+    "typeface-open-sans": "^1.1.13",
     "web-vitals": "^1.0.1"
   },
   "scripts": {
diff --git a/client/src/common/components/countdown/Countdown.module.css b/client/src/common/components/countdown/Countdown.module.css
index d95ba95de..3b360444f 100644
--- a/client/src/common/components/countdown/Countdown.module.css
+++ b/client/src/common/components/countdown/Countdown.module.css
@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap');
+/* @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap'); */
 
 /* Common */
 .countdownClock,
diff --git a/client/src/common/components/smallTimer/SmallTimer.module.css b/client/src/common/components/smallTimer/SmallTimer.module.css
index 37e5abadb..1ba221c26 100644
--- a/client/src/common/components/smallTimer/SmallTimer.module.css
+++ b/client/src/common/components/smallTimer/SmallTimer.module.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap');
-
 .smallTimer {
   display: flex;
   flex-direction: column;
diff --git a/client/src/features/viewers/backstage/StageManager.module.css b/client/src/features/viewers/backstage/StageManager.module.css
index 52268f227..cf9bad51e 100644
--- a/client/src/features/viewers/backstage/StageManager.module.css
+++ b/client/src/features/viewers/backstage/StageManager.module.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap');
-
 .container__gray,
 .container__grayFinished {
   margin: 0;
diff --git a/client/src/features/viewers/foh/Public.module.css b/client/src/features/viewers/foh/Public.module.css
index 97518aca7..4110f9c48 100644
--- a/client/src/features/viewers/foh/Public.module.css
+++ b/client/src/features/viewers/foh/Public.module.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap');
-
 .container__gray,
 .container__grayFinished {
   margin: 0;
diff --git a/client/src/features/viewers/presenter/PresenterView.module.css b/client/src/features/viewers/presenter/PresenterView.module.css
index 2f4be9bae..2c282002d 100644
--- a/client/src/features/viewers/presenter/PresenterView.module.css
+++ b/client/src/features/viewers/presenter/PresenterView.module.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap');
-
 .container__gray,
 .container__grayFinished {
   margin: 0;
diff --git a/client/src/features/viewers/production/Pip.module.css b/client/src/features/viewers/production/Pip.module.css
index 48b0f5189..008d3cd7d 100644
--- a/client/src/features/viewers/production/Pip.module.css
+++ b/client/src/features/viewers/production/Pip.module.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap');
-
 .container__gray,
 .container__grayFinished {
   margin: 0;
diff --git a/client/src/index.js b/client/src/index.js
index a7628fbec..5d0b0d778 100644
--- a/client/src/index.js
+++ b/client/src/index.js
@@ -8,12 +8,14 @@ import { BrowserRouter } from 'react-router-dom';
 // 1. import Chakra components
 import { ChakraProvider, extendTheme } from '@chakra-ui/react';
 
-
 // 2. Extend the theme to include custom colors, fonts, etc
 const colors = {
   // not yet
 };
 
+// Load Open Sans typeface
+require('typeface-open-sans');
+
 const theme = extendTheme({ colors });
 
 ReactDOM.render(
diff --git a/client/yarn.lock b/client/yarn.lock
index e482e9ef3..1077d6680 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -11876,6 +11876,11 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
+typeface-open-sans@^1.1.13:
+  version "1.1.13"
+  resolved "https://registry.yarnpkg.com/typeface-open-sans/-/typeface-open-sans-1.1.13.tgz#32a09ebd7df59601e01ad81216f98ce641eeafd1"
+  integrity sha512-lVGVHvYl7UJDFB9vN8r7NHw3sVm7Rjeow6b9AeABc/J+2mDaCkmcdVtw3QZnsJW39P+xm5zeggIj9gLHYGn9Iw==
+
 unbox-primitive@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.1.tgz#085e215625ec3162574dc8859abee78a59b14471"