diff --git a/Hooks/useDarkMode.js b/Hooks/useDarkMode.js
new file mode 100644
index 00000000..1160a84a
--- /dev/null
+++ b/Hooks/useDarkMode.js
@@ -0,0 +1,8 @@
+import React from "react";
+import { useState } from "react";
+import { useLocalStorage } from "./useLocalStorage";
+
+export const useDarkMode = (key, initialvalue) => {
+    const [darkmode, setDarkmode] = useLocalStorage("darkMode", initialvalue)
+    return [darkmode, setDarkmode]
+}
\ No newline at end of file
diff --git a/Hooks/useLocalStorage.js b/Hooks/useLocalStorage.js
new file mode 100644
index 00000000..64fd99f7
--- /dev/null
+++ b/Hooks/useLocalStorage.js
@@ -0,0 +1,17 @@
+import React from "react";
+import { useState } from "react";
+
+export const useLocalStorage = (key, initialvalue) => {
+    const [state, setState] = useState(() => {
+        if (window.localStorage.getItem(key)) {
+            setState(JSON.parse(localStorage.getItem(key)))
+        }
+        localStorage.getItem(key, JSON.stringify(initialvalue));
+        return initialvalue;
+    })
+    const setStoredState = (value) => {
+        localStorage.setItem(key, JSON.stringify(value));
+        setState(value)
+    }
+    return ([state, setStoredState])
+}
\ No newline at end of file
diff --git a/frontend/App.js b/frontend/App.js
index 93ae8648..8b885c06 100644
--- a/frontend/App.js
+++ b/frontend/App.js
@@ -1,8 +1,10 @@
+/* eslint-disable no-unused-vars */
 import React, { useState, useEffect } from "react";
 import axios from "axios";
 
 import Charts from "./components/Charts";
 import Navbar from "./components/Navbar";
+import { useDarkMode } from "../Hooks/useDarkMode";
 
 const App = () => {
   const [coinData, setCoinData] = useState([]);