Configure tailwind with additional CSS properties

src/cryptometrics/styles/globals.css

+@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;

src/cryptometrics/tailwind.config.js

@@ -4,7 +4,28 @@ module.exports = {
     "./components/**/*.{js,ts,jsx,tsx}",
   ],
   theme: {
-    extend: {},
+    extend: {
+      fontFamily: {
+        poppins: "'Poppins', sans-serif",
+        dm: "'DM Sans', sans-serif",
+        inter: "'Inter', sans-serif",
+      },
+      borderRadius: {
+        "4xl": "2rem",
+        "5xl": "3rem",
+        "6xl": "4rem",
+      },
+      borderWidth: {
+        1: "1px",
+      },
+      colors: {
+        dark: {
+          700: "#242731",
+          800: "#1f2128",
+          900: "#191b20",
+        },
+      },
+    },
   },
   plugins: [],
 };