diff --git a/.all-contributorsrc b/.all-contributorsrc
index 0a5faad0..e437b7e0 100644
--- a/.all-contributorsrc
+++ b/.all-contributorsrc
@@ -1,7 +1,9 @@
 {
   "projectName": "JavaScript-Snake",
   "projectOwner": "patorjk",
-  "files": ["README.md"],
+  "files": [
+    "README.md"
+  ],
   "commitType": "docs",
   "commitConvention": "angular",
   "contributorsPerLine": 7,
@@ -11,105 +13,162 @@
       "name": "patorjk",
       "avatar_url": "https://avatars.githubusercontent.com/u/521224?v=4",
       "profile": "http://patorjk.com/",
-      "contributions": ["code", "doc", "design", "bug", "example"]
+      "contributions": [
+        "code",
+        "doc",
+        "design",
+        "bug",
+        "example"
+      ]
     },
     {
       "login": "ultra17",
       "name": "ultra17",
       "avatar_url": "https://avatars.githubusercontent.com/u/27869698?v=4",
       "profile": "https://github.com/ultra17",
-      "contributions": ["code", "doc", "design", "bug"]
+      "contributions": [
+        "code",
+        "doc",
+        "design",
+        "bug"
+      ]
     },
     {
       "login": "Rb64",
       "name": "Rb64",
       "avatar_url": "https://avatars.githubusercontent.com/u/91498309?v=4",
       "profile": "https://github.com/Rb64",
-      "contributions": ["code", "bug"]
+      "contributions": [
+        "code",
+        "bug"
+      ]
     },
     {
       "login": "legoman8304",
       "name": "Wyatt Nulton",
       "avatar_url": "https://avatars.githubusercontent.com/u/43346988?v=4",
       "profile": "https://github.com/legoman8304",
-      "contributions": ["code", "bug"]
+      "contributions": [
+        "code",
+        "bug"
+      ]
     },
     {
       "login": "ashishsiot",
       "name": "Ashish Bhoir",
       "avatar_url": "https://avatars.githubusercontent.com/u/63919950?v=4",
       "profile": "https://github.com/ashishsiot",
-      "contributions": ["doc"]
+      "contributions": [
+        "doc"
+      ]
     },
     {
       "login": "dginovker",
       "name": "Dan G",
       "avatar_url": "https://avatars.githubusercontent.com/u/32943174?v=4",
       "profile": "http://dginovker.github.io",
-      "contributions": ["code", "bug"]
+      "contributions": [
+        "code",
+        "bug"
+      ]
     },
     {
       "login": "Megas4ever",
       "name": "Megas4ever",
       "avatar_url": "https://avatars.githubusercontent.com/u/28103886?v=4",
       "profile": "https://github.com/Megas4ever",
-      "contributions": ["code", "design"]
+      "contributions": [
+        "code",
+        "design"
+      ]
     },
     {
       "login": "mamamia5x",
       "name": "Bugs Bunny",
       "avatar_url": "https://avatars.githubusercontent.com/u/57536929?v=4",
       "profile": "https://github.com/mamamia5x",
-      "contributions": ["code", "bug"]
+      "contributions": [
+        "code",
+        "bug"
+      ]
     },
     {
       "login": "Coteh",
       "name": "James Cote",
       "avatar_url": "https://avatars.githubusercontent.com/u/3276350?v=4",
       "profile": "https://www.jamescote.ca",
-      "contributions": ["code", "bug", "doc"]
+      "contributions": [
+        "code",
+        "bug",
+        "doc"
+      ]
     },
     {
       "login": "yokesharun",
       "name": "Arun Yokesh",
       "avatar_url": "https://avatars.githubusercontent.com/u/12830078?v=4",
       "profile": "http://yokesharun.github.io/",
-      "contributions": ["code", "design"]
+      "contributions": [
+        "code",
+        "design"
+      ]
     },
     {
       "login": "GregFrench",
       "name": "Greg French",
       "avatar_url": "https://avatars.githubusercontent.com/u/17938510?v=4",
       "profile": "https://github.com/GregFrench",
-      "contributions": ["code"]
+      "contributions": [
+        "code"
+      ]
     },
     {
       "login": "KT360",
       "name": "KT360",
       "avatar_url": "https://avatars.githubusercontent.com/u/31077743?v=4",
       "profile": "https://github.com/KT360",
-      "contributions": ["code", "design"]
+      "contributions": [
+        "code",
+        "design"
+      ]
     },
     {
       "login": "Thusal06",
       "name": "Thusal Ranawaka",
       "avatar_url": "https://avatars.githubusercontent.com/u/66709891?v=4",
       "profile": "https://thusal06.github.io/",
-      "contributions": ["code", "design"]
+      "contributions": [
+        "code",
+        "design"
+      ]
     },
     {
       "login": "Furtano",
       "name": "C. S.",
       "avatar_url": "https://avatars.githubusercontent.com/u/4115133?v=4",
       "profile": "https://github.com/Furtano",
-      "contributions": ["code", "design"]
+      "contributions": [
+        "code",
+        "design"
+      ]
     },
     {
       "login": "akhill2606",
       "name": "Akhil Manohar",
       "avatar_url": "https://avatars.githubusercontent.com/u/56164681?v=4",
       "profile": "https://github.com/akhill2606",
-      "contributions": ["code"]
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "DylanLCrocker",
+      "name": "Dylan Crocker",
+      "avatar_url": "https://avatars.githubusercontent.com/DylanLCrocker",
+      "profile": "https://github.com/DylanLCrocker",
+      "contributions": [
+        "code"
+      ]
     }
   ]
-}
+}
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
index f78ec928..e806e840 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,3 @@
 .parcel-cache
+/dist
+/node_modules
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index d7f43490..c95b3b01 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -372,6 +372,7 @@
       "integrity": "sha512-SRZFtqGiaKHlZ2YAvf+NHvBFWS3GnkBvJMfOJM7kxJRK3M1bhbwJa/GgSdzqro5UVf9Bfj6E+pkdrRQIOZ7jMQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@mischnic/json-sourcemap": "^0.1.0",
         "@parcel/cache": "2.13.3",
@@ -2024,6 +2025,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "caniuse-lite": "^1.0.30001688",
         "electron-to-chromium": "^1.5.73",
@@ -3256,21 +3258,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/srcset": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/srcset/-/srcset-5.0.1.tgz",
-      "integrity": "sha512-/P1UYbGfJVlxZag7aABNRrulEXAwCSDo7fklafOQrantuPTDmYgijJMks2zusPCVzgW9+4P69mq7w6pYuZpgxw==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "engines": {
-        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
diff --git a/src/css/blue-snake.css b/src/css/blue-snake.css
new file mode 100644
index 00000000..a8fc75c2
--- /dev/null
+++ b/src/css/blue-snake.css
@@ -0,0 +1,138 @@
+body {
+    margin: 0px;
+    padding: 0px;
+    background-color: rgb(0, 70, 32);
+}
+
+#game-area {
+    margin: 10px;
+    padding: 0px;
+}
+
+#mode-wrapper {
+    color: #ffffff;
+    font-family: Verdana, arial, helvetica, sans-serif;
+    font-size: 14px;
+}
+
+a.snake-link,
+a.snake-link:link,
+a.snake-link:visited {
+    color: #ffffff;
+}
+
+.snake-pause-screen {
+    font-family: Verdana, arial, helvetica, sans-serif;
+    font-size: 14px;
+    position: absolute;
+    width: 300px;
+    height: 80px;
+    text-align: center;
+    top: 50%;
+    left: 50%;
+    margin-top: -40px;
+    margin-left: -150px;
+    display: none;
+    background-color: rgb(0, 70, 32);
+    color: white;
+}
+
+.snake-panel-component {
+    position: absolute;
+    font-family: Verdana, arial, helvetica, sans-serif;
+    font-size: 14px;
+    color: #ffffff;
+    text-align: center;
+    padding: 8px;
+    margin: 0px;
+}
+
+#snake-snakehead-alive {
+    background-image: url("src/css/images/green-head-snakeblock.png");
+    margin: 0px;
+    padding: 0px;
+    background-color: rgb(6, 104, 134);
+    position: absolute;
+    border: 0px solid #000000;
+    background-repeat: no-repeat;
+    border-radius: 4px;
+}
+
+.snake-snakebody-block {
+    margin: 0px;
+    padding: 0px;
+    background-color: #247fb4;
+    position: absolute;
+    background-repeat: no-repeat;
+}
+
+.snake-snakebody-alive {
+    background-image: url("src/css/images/snakeblock.png");
+}
+
+.snake-snakebody-dead {
+    background-image: url("src/css/images/deadblock.png");
+}
+
+.snake-food-block {
+    margin: 0px;
+    padding: 0px;
+    background-color: rgb(207, 33, 33);
+    border: 0px solid #000000;
+    position: absolute;
+    border-radius: 6px;
+}
+
+.snake-playing-field {
+    margin: 0px;
+    padding: 0px;
+    position: absolute;
+    background-color: rgb(20, 156, 54);
+    border: 0px solid #000000;
+}
+
+.snake-game-container {
+    margin: 0px;
+    padding: 0px;
+    border-width: 0px;
+    border-style: none;
+    zoom: 1;
+    position: relative;
+}
+
+.snake-welcome-dialog {
+    padding: 8px;
+    margin: 0px;
+    background-color: #000000;
+    color: #ffffff;
+    font-family: Verdana, arial, helvetica, sans-serif;
+    font-size: 14px;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 300px;
+    /*height: 150px;*/
+    margin-top: -100px;
+    margin-left: -158px;
+    text-align: center;
+    display: block;
+}
+
+.snake-try-again-dialog,
+.snake-win-dialog {
+    padding: 8px;
+    margin: 0px;
+    background-color: #000000;
+    color: #ffffff;
+    font-family: Verdana, arial, helvetica, sans-serif;
+    font-size: 14px;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 300px;
+    height: 100px;
+    margin-top: -75px;
+    margin-left: -158px;
+    text-align: center;
+    display: none;
+}
\ No newline at end of file
diff --git a/src/index.html b/src/index.html
index 03dc6b10..38c36570 100755
--- a/src/index.html
+++ b/src/index.html
@@ -1,7 +1,8 @@
 <!doctype html>
 <html lang="en">
-  <head>
-    <!--
+
+<head>
+  <!--
 
   JavaScript Snake
   https://patorjk.com/games/snake
@@ -9,77 +10,75 @@
   Source code is available here: https://github.com/patorjk/JavaScript-Snake
 
   -->
-    <meta charset="utf-8" />
-    <title>JavaScript Snake</title>
-    <link
-      rel="stylesheet"
-      id="style"
-      type="text/css"
-      href="css/main-snake.css"
-    />
-    <link rel="shortcut icon" href="css/images/favicon.png" />
-    <style>
-      .snake-toolbar {
-        position: absolute;
-        top: 0;
-        left: 0;
-        z-index: 10000;
-        padding: 5px;
-      }
-    </style>
-    <script>
-      function getTheme() {
-        function changeTheme(themeUrl) {
-          const elm = document.getElementById("style");
-          elm && elm.remove();
+  <meta charset="utf-8" />
+  <title>JavaScript Snake</title>
+  <link rel="stylesheet" id="style" type="text/css" href="css/main-snake.css" />
+  <link rel="shortcut icon" href="css/images/favicon.png" />
+  <style>
+    .snake-toolbar {
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: 10000;
+      padding: 5px;
+    }
+  </style>
+  <script>
+    function getTheme() {
+      function changeTheme(themeUrl) {
+        const elm = document.getElementById("style");
+        elm && elm.remove();
 
-          const newCss = document.createElement("link");
-          newCss.id = "style";
-          newCss.rel = "stylesheet";
-          newCss.type = "text/css";
-          newCss.href = themeUrl;
-          document.head.appendChild(newCss);
-        }
+        const newCss = document.createElement("link");
+        newCss.id = "style";
+        newCss.rel = "stylesheet";
+        newCss.type = "text/css";
+        newCss.href = themeUrl;
+        document.head.appendChild(newCss);
+      }
 
-        const index = document.getElementById("select").selectedIndex;
-        switch (index) {
-          case 0:
-            changeTheme("./css/light-snake.css?" + Math.random());
-            break;
-          case 1:
-            changeTheme("./css/main-snake.css?" + Math.random());
-            break;
-          case 2:
-            changeTheme("css/dark-snake.css?" + Math.random());
-            break;
-          case 3:
-            changeTheme("css/green-snake.css?" + Math.random());
-            break;
-          case 4:
-            changeTheme("css/matrix-snake.css?" + Math.random());
-            break;
-          case 5:
-            changeTheme("css/Senura-snake.css?" + Math.random());
-            break;
-          case 6:
-            changeTheme("css/head-snake.css?" + Math.random());
-            break;
-          case 7:
-            changeTheme("css/black-snake.css?" + Math.random());
-            break;
-          case 8:
-            changeTheme("css/neon-snake.css?" + Math.random());
-            break;
-          default:
-            changeTheme("css/main-snake.css?" + Math.random());
-            break;
-        }
-        setTimeout(function () {
-          document.getElementById("game-area").focus();
-        }, 10);
+      const index = document.getElementById("select").selectedIndex;
+      switch (index) {
+        case 0:
+          changeTheme("./css/light-snake.css?" + Math.random());
+          break;
+        case 1:
+          changeTheme("./css/main-snake.css?" + Math.random());
+          break;
+        case 2:
+          changeTheme("css/dark-snake.css?" + Math.random());
+          break;
+        case 3:
+          changeTheme("css/green-snake.css?" + Math.random());
+          break;
+        case 4:
+          changeTheme("css/matrix-snake.css?" + Math.random());
+          break;
+        case 5:
+          changeTheme("css/Senura-snake.css?" + Math.random());
+          break;
+        case 6:
+          changeTheme("css/head-snake.css?" + Math.random());
+          break;
+        case 7:
+          changeTheme("css/black-snake.css?" + Math.random());
+          break;
+        case 8:
+          changeTheme("css/neon-snake.css?" + Math.random());
+          break;
+        case 9:
+          changeTheme("./css/blue-snake.css?" + Math.random());
+          break;
+        default:
+          changeTheme("css/main-snake.css?" + Math.random());
+          break;
       }
-    </script>
-    <!--
+      setTimeout(function () {
+        document.getElementById("game-area").focus();
+      }, 10);
+    }
+  </script>
+  <!--
   <script async src="https://www.googletagmanager.com/gtag/js?id=G-352HTB3H82"></script>
   <script>
     window.dataLayer = window.dataLayer || [];
@@ -88,64 +87,68 @@
 
     gtag('config', 'G-352HTB3H82');
   </script>
-  --></head>
-  <body>
-    <div class="snake-toolbar">
-      <div style="display: inline-block; margin-right: 10px">
-        <span>Theme:</span>
-        <select autocomplete="off" id="select">
-          <option>Light Theme by yokesharun</option>
-          <option selected>Main Theme by patorjk</option>
-          <option>Dark Theme by KenyStev</option>
-          <option>Green Theme by CoffeeCatDE</option>
-          <option>Matrix Theme by Geahad Haymor</option>
-          <option>Theme by Senura Ratnayake</option>
-          <option>Snake Head Theme by Rb64</option>
-          <option>Black and purple Theme by LucassSantoss</option>
-          <option>Neon Theme by Daisy21000</option>
-        </select>
-      </div>
-      <div style="display: inline-block; margin-right: 10px">
-        <span>Mode:</span>
-        <select id="selectMode">
-          <option value="100">Easy</option>
-          <option value="75" selected>Medium</option>
-          <option value="50">Hard</option>
-          <option value="25">Impossible</option>
-          <option value="110">Rush</option>
-        </select>
-      </div>
-      <button id="go_full_screen">Full Screen</button>
-      <br />
+  -->
+</head>
+
+<body>
+  <div class="snake-toolbar">
+    <div style="display: inline-block; margin-right: 10px">
+      <span>Theme:</span>
+      <select autocomplete="off" id="select">
+        <option>Light Theme by yokesharun</option>
+        <option selected>Main Theme by patorjk</option>
+        <option>Dark Theme by KenyStev</option>
+        <option>Green Theme by CoffeeCatDE</option>
+        <option>Matrix Theme by Geahad Haymor</option>
+        <option>Theme by Senura Ratnayake</option>
+        <option>Snake Head Theme by Rb64</option>
+        <option>Black and purple Theme by LucassSantoss</option>
+        <option>Neon Theme by Daisy21000</option>
+        <option>Original Theme by DylanLCrocker</option>
+      </select>
     </div>
+    <div style="display: inline-block; margin-right: 10px">
+      <span>Mode:</span>
+      <select id="selectMode">
+        <option value="100">Easy</option>
+        <option value="75" selected>Medium</option>
+        <option value="50">Hard</option>
+        <option value="25">Impossible</option>
+        <option value="110">Rush</option>
+      </select>
+    </div>
+    <button id="go_full_screen">Full Screen</button>
+    <br />
+  </div>
 
-    <div id="mode-wrapper" style="display: inline; width: auto"></div>
+  <div id="mode-wrapper" style="display: inline; width: auto"></div>
 
-    <div id="game-area" tabindex="0"></div>
-    <script type="text/javascript" src="js/snake.js"></script>
-    <script type="text/javascript" src="js/init.js"></script>
-    <script type="text/javascript">
-      document.getElementById('select').addEventListener('change', getTheme);
+  <div id="game-area" tabindex="0"></div>
+  <script type="text/javascript" src="js/snake.js"></script>
+  <script type="text/javascript" src="js/init.js"></script>
+  <script type="text/javascript">
+    document.getElementById('select').addEventListener('change', getTheme);
 
-      function go_full_screen() {
-        const elem = document.documentElement;
-        try {
-          if (elem.requestFullscreen) {
-            elem.requestFullscreen();
-          } else if (elem.msRequestFullscreen) {
-            elem.msRequestFullscreen();
-          } else if (elem.mozRequestFullScreen) {
-            elem.mozRequestFullScreen();
-          } else if (elem.webkitRequestFullscreen) {
-            elem.webkitRequestFullscreen();
-          }
-        } catch (err) {
-          console.error(err);
-          alert("Sorry, fullscreen won't work in this setup.");
+    function go_full_screen() {
+      const elem = document.documentElement;
+      try {
+        if (elem.requestFullscreen) {
+          elem.requestFullscreen();
+        } else if (elem.msRequestFullscreen) {
+          elem.msRequestFullscreen();
+        } else if (elem.mozRequestFullScreen) {
+          elem.mozRequestFullScreen();
+        } else if (elem.webkitRequestFullscreen) {
+          elem.webkitRequestFullscreen();
         }
+      } catch (err) {
+        console.error(err);
+        alert("Sorry, fullscreen won't work in this setup.");
       }
+    }
+
+    document.getElementById('go_full_screen').addEventListener('click', go_full_screen);
+  </script>
+</body>
 
-      document.getElementById('go_full_screen').addEventListener('click', go_full_screen);
-    </script>
-  </body>
-</html>
+</html>
\ No newline at end of file