diff --git a/postcss.config.cjs b/postcss.config.cjs
deleted file mode 100644
index 33ad091..0000000
--- a/postcss.config.cjs
+++ /dev/null
@@ -1,6 +0,0 @@
-module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-}
diff --git a/src/styles/index.css b/src/styles/index.css
index e216370..e2c99ec 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -3,6 +3,24 @@
 @import url("https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap");
 @import "tailwindcss";
 
+@theme {
+  --font-family-opensans: "Open Sans", sans-serif;
+  --font-family-inter: "Inter", sans-serif;
+  --font-family-mono: "Roboto Mono", monospace;
+  --font-family-raleway: "Raleway", sans-serif;
+  --font-family-roboto: "Roboto";
+
+  --box-shadow-inner-md: inset 1px 4px 6px 0 rgb(0 0 0 / 0.1);
+  --box-shadow-inner-md-2: inset 2px 2px 6px 0 rgb(0 0 0 / 0.15);
+  --box-shadow-inner-md-3: inset 2px 4px 6px 0 rgb(0 0 0 / 0.21);
+  --box-shadow-inner-md-4: inset 2px 4px 10px 0 rgb(0 0 0 / 0.28);
+  --box-shadow-inner-lg: inset 4px 5px 7px 0 rgb(0 0 0 / 0.2);
+  --box-shadow-inner-xl: inset 4px 9px 9px 0 rgb(0 0 0 / 0.3);
+  --box-shadow-inner-2xl: inset 4px 11px 12px 0 rgb(0 0 0 / 0.3);
+
+  --screens-xs: 450px;
+}
+
 :root {
   font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
   font-size: 16px;
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
deleted file mode 100644
index 2797fc9..0000000
--- a/tailwind.config.cjs
+++ /dev/null
@@ -1,28 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
-  theme: {
-    extend: {
-      screens: {
-        xs: "450px",
-      },
-      boxShadow: {
-        "inner-md": "inset 1px 4px 6px 0 rgb(0 0 0 / 0.1)",
-        "inner-md-2": "inset 2px 2px 6px 0 rgb(0 0 0 / 0.15)",
-        "inner-md-3": "inset 2px 4px 6px 0 rgb(0 0 0 / 0.21)",
-        "inner-md-4": "inset 2px 4px 10px 0 rgb(0 0 0 / 0.28)",
-        "inner-lg": "inset 4px 5px 7px 0 rgb(0 0 0 / 0.2)",
-        "inner-xl": "inset 4px 9px 9px 0 rgb(0 0 0 / 0.3)",
-        "inner-2xl": "inset 4px 11px 12px 0 rgb(0 0 0 / 0.3)",
-      },
-      fontFamily: {
-        opensans: ['"Open Sans"', "sans-serif"],
-        inter: ['"Inter"', "sans-serif"],
-        mono: ['"Roboto Mono"', "monospace"],
-        raleway: ['"Raleway"', "sans-serif"],
-        roboto: ['"Roboto"'],
-      },
-    },
-  },
-  plugins: [],
-};