diff --git a/dark-mode.js b/dark-mode.js
new file mode 100644
index 00000000..c07dabbd
--- /dev/null
+++ b/dark-mode.js
@@ -0,0 +1,29 @@
+document.addEventListener("DOMContentLoaded", function () {
+    const themeToggleCheckbox = document.querySelector("#theme-toggle");
+    const themeLabel = document.querySelector(".toggle-label");
+  
+    // Function to set the theme
+    function setTheme(theme) {
+      if (theme === "dark") {
+        document.body.classList.add("dark-mode");
+        themeLabel.textContent = "Dark Mode";
+        themeToggleCheckbox.checked = true;
+      } else {
+        document.body.classList.remove("dark-mode");
+        themeLabel.textContent = "Light Mode";
+        themeToggleCheckbox.checked = false;
+      }
+      localStorage.setItem("theme", theme);
+    }
+  
+    // Load the theme from localStorage
+    const savedTheme = localStorage.getItem("theme") || "light";
+    setTheme(savedTheme);
+  
+    // Add event listener to toggle checkbox
+    themeToggleCheckbox.addEventListener("change", () => {
+      const newTheme = themeToggleCheckbox.checked ? "dark" : "light";
+      setTheme(newTheme);
+    });
+  });
+  
\ No newline at end of file
diff --git a/index.html b/index.html
index 2d96f901..bd425098 100644
--- a/index.html
+++ b/index.html
@@ -49,5 +49,6 @@ <h1 class="main-heading">Awesome GitHub Profile READMEs</h1>
       </div>
     </div>
     <script src="retriveprofile.js"></script>
+    <script src="dark-mode.js"></script>
   </body>
 </html>
diff --git a/retriveprofile.js b/retriveprofile.js
index 4e22f679..1fe82688 100644
--- a/retriveprofile.js
+++ b/retriveprofile.js
@@ -1,33 +1,6 @@
 document.addEventListener("DOMContentLoaded", function () {
-    const themeToggleCheckbox = document.querySelector("#theme-toggle");
-    const themeLabel = document.querySelector(".toggle-label");
-  
-    // Function to set the theme
-    function setTheme(theme) {
-      if (theme === "dark") {
-        document.body.classList.add("dark-mode");
-        themeLabel.textContent = "Dark Mode";
-        themeToggleCheckbox.checked = true;
-      } else {
-        document.body.classList.remove("dark-mode");
-        themeLabel.textContent = "Light Mode";
-        themeToggleCheckbox.checked = false;
-      }
-      localStorage.setItem("theme", theme);
-    }
-  
-    // Load the theme from localStorage
-    const savedTheme = localStorage.getItem("theme") || "light";
-    setTheme(savedTheme);
-  
-    // Add event listener to toggle checkbox
-    themeToggleCheckbox.addEventListener("change", () => {
-      const newTheme = themeToggleCheckbox.checked ? "dark" : "light";
-      setTheme(newTheme);
-    });
-  
-    // Fetch and render profiles
     let contributors = [];
+  
     function renderProfiles(filter = "") {
       const container = document.querySelector(".profiles");
       container.innerHTML = "";