diff --git a/web/src/components/App/index.jsx b/web/src/components/App/index.jsx
index a80aa96..665b0e3 100644
--- a/web/src/components/App/index.jsx
+++ b/web/src/components/App/index.jsx
@@ -24,6 +24,7 @@ export const darkTheme = createMuiTheme({
     primary: { main: '#00a572' },
     background: { paper: '#575757' },
   },
+  typography: { fontFamily: 'Open Sans, sans-serif' },
 })
 export const lightTheme = createMuiTheme({
   palette: {
@@ -31,6 +32,7 @@ export const lightTheme = createMuiTheme({
     primary: { main: '#00a572' },
     background: { paper: '#cbe8d9' },
   },
+  typography: { fontFamily: 'Open Sans, sans-serif' },
 })
 
 export default function App() {
diff --git a/web/src/components/App/style.js b/web/src/components/App/style.js
index ac1e845..71e9e8a 100644
--- a/web/src/components/App/style.js
+++ b/web/src/components/App/style.js
@@ -19,7 +19,7 @@ export const CenteredGrid = styled.div`
 
 export const AppHeader = styled.div`
   background: #00a572;
-  color: #1a1a1a;
+  color: #eee;
   grid-area: head;
   display: grid;
   grid-auto-flow: column;