diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index e04594e2..3c6a4c73 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -21,6 +21,7 @@
         "jose": "^4.8.1",
         "moment": "^2.29.3",
         "next": "^12.3.1",
+        "next-cookies": "^2.0.3",
         "next-http-proxy-middleware": "^1.2.4",
         "next-pwa": "^5.5.2",
         "react": "18.0.0",
@@ -2514,6 +2515,11 @@
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
       "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ=="
     },
+    "node_modules/@types/cookie": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz",
+      "integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow=="
+    },
     "node_modules/@types/eslint": {
       "version": "8.4.1",
       "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.4.1.tgz",
@@ -3333,6 +3339,14 @@
         "safe-buffer": "~5.1.1"
       }
     },
+    "node_modules/cookie": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
+      "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/cookies-next": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/cookies-next/-/cookies-next-2.0.4.tgz",
@@ -3353,14 +3367,6 @@
       "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.27.tgz",
       "integrity": "sha512-C1pD3kgLoZ56Uuy5lhfOxie4aZlA3UMGLX9rXteq4WitEZH6Rl80mwactt9QG0w0gLFlN/kLBTFnGXtDVWvWQw=="
     },
-    "node_modules/cookies-next/node_modules/cookie": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
-      "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
     "node_modules/core-js-compat": {
       "version": "3.22.3",
       "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.22.3.tgz",
@@ -5775,6 +5781,14 @@
         }
       }
     },
+    "node_modules/next-cookies": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/next-cookies/-/next-cookies-2.0.3.tgz",
+      "integrity": "sha512-YVCQzwZx+sz+KqLO4y9niHH9jjz6jajlEQbAKfsYVT6DOfngb/0k5l6vFK4rmpExVug96pGag8OBsdSRL9FZhQ==",
+      "dependencies": {
+        "universal-cookie": "^4.0.2"
+      }
+    },
     "node_modules/next-http-proxy-middleware": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/next-http-proxy-middleware/-/next-http-proxy-middleware-1.2.4.tgz",
@@ -7265,6 +7279,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/universal-cookie": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz",
+      "integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==",
+      "dependencies": {
+        "@types/cookie": "^0.3.3",
+        "cookie": "^0.4.0"
+      }
+    },
     "node_modules/universalify": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
@@ -9525,6 +9548,11 @@
         }
       }
     },
+    "@types/cookie": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz",
+      "integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow=="
+    },
     "@types/eslint": {
       "version": "8.4.1",
       "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.4.1.tgz",
@@ -10181,6 +10209,11 @@
         "safe-buffer": "~5.1.1"
       }
     },
+    "cookie": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
+      "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA=="
+    },
     "cookies-next": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/cookies-next/-/cookies-next-2.0.4.tgz",
@@ -10200,11 +10233,6 @@
           "version": "16.11.27",
           "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.27.tgz",
           "integrity": "sha512-C1pD3kgLoZ56Uuy5lhfOxie4aZlA3UMGLX9rXteq4WitEZH6Rl80mwactt9QG0w0gLFlN/kLBTFnGXtDVWvWQw=="
-        },
-        "cookie": {
-          "version": "0.4.2",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
-          "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA=="
         }
       }
     },
@@ -12009,6 +12037,14 @@
         "use-sync-external-store": "1.2.0"
       }
     },
+    "next-cookies": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/next-cookies/-/next-cookies-2.0.3.tgz",
+      "integrity": "sha512-YVCQzwZx+sz+KqLO4y9niHH9jjz6jajlEQbAKfsYVT6DOfngb/0k5l6vFK4rmpExVug96pGag8OBsdSRL9FZhQ==",
+      "requires": {
+        "universal-cookie": "^4.0.2"
+      }
+    },
     "next-http-proxy-middleware": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/next-http-proxy-middleware/-/next-http-proxy-middleware-1.2.4.tgz",
@@ -13065,6 +13101,15 @@
         "crypto-random-string": "^2.0.0"
       }
     },
+    "universal-cookie": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz",
+      "integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==",
+      "requires": {
+        "@types/cookie": "^0.3.3",
+        "cookie": "^0.4.0"
+      }
+    },
     "universalify": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 11cbdceb..ce915e19 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -22,6 +22,7 @@
     "jose": "^4.8.1",
     "moment": "^2.29.3",
     "next": "^12.3.1",
+    "next-cookies": "^2.0.3",
     "next-http-proxy-middleware": "^1.2.4",
     "next-pwa": "^5.5.2",
     "react": "18.0.0",
diff --git a/frontend/src/pages/_app.tsx b/frontend/src/pages/_app.tsx
index 4b62c16c..adf86132 100644
--- a/frontend/src/pages/_app.tsx
+++ b/frontend/src/pages/_app.tsx
@@ -8,8 +8,9 @@ import {
 import { useColorScheme } from "@mantine/hooks";
 import { ModalsProvider } from "@mantine/modals";
 import { NotificationsProvider } from "@mantine/notifications";
-import { getCookie, setCookies } from "cookies-next";
+import { setCookies } from "cookies-next";
 import { GetServerSidePropsContext } from "next";
+import cookies from "next-cookies";
 import type { AppProps } from "next/app";
 import { useEffect, useState } from "react";
 import Footer from "../components/Footer";
@@ -22,9 +23,7 @@ import globalStyle from "../styles/mantine.style";
 import { CurrentUser } from "../types/user.type";
 import { GlobalLoadingContext } from "../utils/loading.util";
 
-function App(
-  props: AppProps & { colorScheme: ColorScheme; environmentVariables: any }
-) {
+function App(props: AppProps & { colorScheme: ColorScheme }) {
   const { Component, pageProps } = props;
 
   const systemTheme = useColorScheme();
@@ -91,6 +90,6 @@ export default App;
 
 App.getInitialProps = ({ ctx }: { ctx: GetServerSidePropsContext }) => {
   return {
-    colorScheme: getCookie("color-schema") || "light",
+    colorScheme: cookies(ctx)["color-schema"] || "light",
   };
 };