change font to Inter

gatsby-browser.js

@@ -3,7 +3,7 @@ import { Provider } from "react-redux";
 import store from "./src/store/store";
 import "react-vis/dist/style.css";
 import "prismjs/themes/prism-tomorrow.css";
-import "typeface-roboto";
+import "typeface-inter";
 import { ThemeContextProvider } from "./src/context";
 
 export const wrapRootElement = ({ element }) => (

package-lock.json

@@ -38,6 +38,7 @@
         "redux": "^4.0.5",
         "redux-thunk": "^2.3.0",
         "reselect": "^4.0.0",
+        "typeface-inter": "^3.18.1",
         "typeface-roboto": "0.0.75",
         "worker-loader": "^2.0.0"
       },
@@ -24200,6 +24201,12 @@
         "is-typedarray": "^1.0.0"
       }
     },
+    "node_modules/typeface-inter": {
+      "version": "3.18.1",
+      "resolved": "https://registry.npmjs.org/typeface-inter/-/typeface-inter-3.18.1.tgz",
+      "integrity": "sha512-c+TBanYFCvmg3j5vPk+zxK4ocMZbPxMEmjnwG7rPQoV87xvQ6b07VbAOC0Va0XBbbZCGw6cWNeFuLeg1YQru3Q==",
+      "license": "OFL-1.1"
+    },
     "node_modules/typeface-roboto": {
       "version": "0.0.75",
       "resolved": "https://registry.npmjs.org/typeface-roboto/-/typeface-roboto-0.0.75.tgz",

package.json

@@ -33,6 +33,7 @@
     "redux": "^4.0.5",
     "redux-thunk": "^2.3.0",
     "reselect": "^4.0.0",
+    "typeface-inter": "^3.18.1",
     "typeface-roboto": "0.0.75",
     "worker-loader": "^2.0.0"
   },
@@ -40,8 +41,8 @@
     "eslint": "^6.8.0",
     "eslint-plugin-react": "^7.23.2",
     "nodemon": "^3.1.9",
-    "serve": "^14.2.4",
-    "prettier": "^1.19.1"
+    "prettier": "^1.19.1",
+    "serve": "^14.2.4"
   },
   "keywords": [
     "gatsby"

src/pages/about.js

@@ -9,7 +9,7 @@ const AboutPage = () => {
         maxWidth: '900px',
         margin: '80px auto 20px',
         padding: '0 20px',
-        fontFamily: 'Arial, sans-serif',
+        fontFamily: 'Inter, sans-serif',
     };
 
     return (