Added the dynamic background

assets/css/style.css

@@ -4,6 +4,7 @@ width: 100%;
 height: 100%;
 margin: 0px;
 padding: 0px;
+transition: background-color 4s ease;
 overflow-x: hidden;}
 #about {
   color: white;

assets/js/background.js

@@ -0,0 +1,27 @@
+const randomColor = () => {
+    const hex = '0123456789ABCDEF';
+    let color = '#';
+    for (let i = 0; i < 6; i++) {
+        color += hex[Math.floor(Math.random() * 16)];
+    }
+    return color;
+};
+
+let id;
+
+const startChanging = () => {
+    if (!id) { // better practice 
+        id = setInterval(change, 2500); // Set interval to 2000 milliseconds (2 seconds)
+    }
+    function change() {
+        document.body.style.backgroundColor = randomColor();
+    }
+};
+
+const stopChanging = () => {
+    clearInterval(id);
+    id = null; // flushes out the value after stop and hence no overriding
+};
+
+// Start changing colors when the page loads
+window.onload = startChanging;

index.html

@@ -391,7 +391,7 @@ <h2 id="total-contributors" style="text-align: center; font-family: 'Agency FB',
   <script src="./assets/js/contributors.js"></script>
   <script src="./assets/js/cursor_transition.js"></script>
   <script src="./assets/js/contributors.js"></script>
-
+  <script src="./assets/js/background.js"></script>