diff --git a/js/externalLinkHandler.js b/js/externalLinkHandler.js
index 0feee1b178ab513984bc09e9cd0078b66a4ad5a2..183b669d7d03d8ec16be97951cb19c14f25b95e0 100644
--- a/js/externalLinkHandler.js
+++ b/js/externalLinkHandler.js
@@ -5,5 +5,7 @@ document.onreadystatechange = function () {
              console.log(href);
              element.target = "_blank";
          }
-     })
+     });
+
+     document.querySelector(".loader").style.display = "none";
 }
\ No newline at end of file
diff --git a/js/loader.js b/js/loader.js
new file mode 100644
index 0000000000000000000000000000000000000000..337977b401e0e6af7bf7cd0ac5e40fad298b5d29
--- /dev/null
+++ b/js/loader.js
@@ -0,0 +1,11 @@
+let div = document.createElement("div");
+div.className = "loader";
+div.innerHTML = `<div class="loader-dots">
+  <div class="dots"></div>
+  <div class="dots"></div>
+  <div class="dots"></div>
+  <div class="dots"></div>
+  <div class="dots"></div>
+</div>`;
+
+document.body.appendChild(div);
\ No newline at end of file
diff --git a/js/script.js b/js/script.js
index dccfa637e31ca37386581913b1212c60a0011605..8b4271f898f684f6c5464d195e698e8fd92ad53d 100644
--- a/js/script.js
+++ b/js/script.js
@@ -1,3 +1,4 @@
+require("./loader");
 require("./browserCheck");
 
 require("./error");
diff --git a/scss/_loader.scss b/scss/_loader.scss
new file mode 100644
index 0000000000000000000000000000000000000000..b76e566af7c8672d0956f7d88a2f199c08f63b2a
--- /dev/null
+++ b/scss/_loader.scss
@@ -0,0 +1,61 @@
+.loader {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  transition: visibility 0s, opacity 0.5s linear;
+  background-color: $back-color;
+
+  .loader-dots {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+
+    .dots {
+      position: absolute;
+      padding: 10px;
+      border-radius: 50%;
+      background: $accent-color;
+      -webkit-animation: loader 1s ease-in-out 0s infinite;
+      animation: loader 1s ease-in-out 0s infinite;
+
+      &:nth-child(1) {
+        -webkit-animation-delay: 0s;
+        animation-delay: 0s;
+      }
+
+      &:nth-child(2) {
+        -webkit-animation-delay: 0.15s;
+        animation-delay: 0.15s;
+      }
+
+      &:nth-child(3) {
+        -webkit-animation-delay: 0.30s;
+        animation-delay: 0.30s;
+      }
+
+      &:nth-child(4) {
+        -webkit-animation-delay: 0.45s;
+        animation-delay: 0.45s;
+      }
+    }
+
+  }
+}
+
+@keyframes loader {
+  0% {
+    -webkit-transform: translateX(-100px);
+    transform: translateX(-100px);
+    opacity: 0;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateX(100px);
+    transform: translateX(100px);
+    opacity: 0;
+  }
+}
\ No newline at end of file
diff --git a/scss/style.scss b/scss/style.scss
index 4f6d62c46c9e30fcc6d677f62023dcb2cdd71917..8ba928f6b0fcdac5d2c8c427123958c01e8e1903 100644
--- a/scss/style.scss
+++ b/scss/style.scss
@@ -1,5 +1,6 @@
 @import "var";
 @import "colorMixer";
+@import "loader";
 @import "general";
 @import "menue";
 @import "normalize";