diff --git a/docs/assets/title-empty.jpg b/docs/assets/title-empty.jpg
new file mode 100644
index 0000000..5864d6b
Binary files /dev/null and b/docs/assets/title-empty.jpg differ
diff --git a/docs/assets/title.jpg b/docs/assets/title.jpg
new file mode 100644
index 0000000..75fcdc4
Binary files /dev/null and b/docs/assets/title.jpg differ
diff --git a/docs/battery.html b/docs/battery.html
index bfea516..5ca3072 100644
--- a/docs/battery.html
+++ b/docs/battery.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/contributors.html b/docs/contributors.html
index 3e7ac22..55f21b1 100644
--- a/docs/contributors.html
+++ b/docs/contributors.html
@@ -17,7 +17,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/copyright.html b/docs/copyright.html
index 19463cf..efb3117 100644
--- a/docs/copyright.html
+++ b/docs/copyright.html
@@ -17,7 +17,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/cpu.html b/docs/cpu.html
index 51945c5..562d56e 100644
--- a/docs/cpu.html
+++ b/docs/cpu.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/docker.html b/docs/docker.html
index 96d9509..ff212b5 100644
--- a/docs/docker.html
+++ b/docs/docker.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/filesystem.html b/docs/filesystem.html
index dc4d0a5..752390c 100644
--- a/docs/filesystem.html
+++ b/docs/filesystem.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/general.html b/docs/general.html
index 79acd27..79580ca 100644
--- a/docs/general.html
+++ b/docs/general.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/gettingstarted.html b/docs/gettingstarted.html
index c4fd3d3..db8cc80 100644
--- a/docs/gettingstarted.html
+++ b/docs/gettingstarted.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/graphics.html b/docs/graphics.html
index 13ea6bb..1667318 100644
--- a/docs/graphics.html
+++ b/docs/graphics.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/history.html b/docs/history.html
index 00b3b75..c17491c 100644
--- a/docs/history.html
+++ b/docs/history.html
@@ -16,7 +16,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/index.html b/docs/index.html
index 0475555..afd9aef 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -11,12 +11,15 @@
   <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-LRlmVvLKVApDVGuspQFnRQJjkv0P7/YFrw84YYQtmYG4nK8c+M+NlmYDCv0rKWpG" crossorigin="anonymous">
   <link rel="stylesheet" href="styles.css">
 
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.9/typed.min.js"></script>
+
   <title>systeminformation</title>
   <script>
     function numberWithCommas(x) {
       return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
     }
     function getDownloads() {
+      typed();
       var xhttp = new XMLHttpRequest();
       xhttp.onreadystatechange = function () {
         if (this.readyState == 4 && this.status == 200) {
@@ -38,15 +41,27 @@
       xhttp.open("GET", "https://registry.npmjs.org/systeminformation/latest", true);
       xhttp.send();
     }
+    function typed() {
+      var options = {
+        strings: ["System and OS information library for node.js", "Get detailed hardware, system &amp; OS information.", "For Linux, macOS, Windows, FreeBSD, SunOS"],
+        typeSpeed: 60,
+        loop: false,
+        backDelay: 1200,
+
+      }
+      console.log('asd')
+      var typed = new Typed('#typed', options);
+
+    }
   </script>
 
 </head>
 
-<body onload="getDownloads()">
-  <header class="bg-image-full" style="background-image: url('./assets/motherboard.jpg');">
+<body onload="getDownloads();">
+  <header class="bg-image-full" style="background-image: url('./assets/title-empty.jpg');">
     <img class="logo" src="assets/logo.png">
     <div class="title">systeminformation</div>
-    <div class="subtitle">Simple system and OS information library for node.js</div>
+    <div class="subtitle"><span id="typed"></span></div>
     <div class="version">Current Version: <span id="version">4.0.0</span></div>
     <button class="btn btn-light" onclick="location.href='https://github.com/sebhildebrandt/systeminformation'"">View on Github <i class=" fab fa-github"></i></button>
   </header>
diff --git a/docs/issues.html b/docs/issues.html
index 7862e22..d49a8e1 100644
--- a/docs/issues.html
+++ b/docs/issues.html
@@ -17,7 +17,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/memory.html b/docs/memory.html
index d506b27..b1f7f0a 100644
--- a/docs/memory.html
+++ b/docs/memory.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/network.html b/docs/network.html
index e4099a0..6581c28 100644
--- a/docs/network.html
+++ b/docs/network.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/os.html b/docs/os.html
index dba7b22..e45ecdb 100644
--- a/docs/os.html
+++ b/docs/os.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/processes.html b/docs/processes.html
index db201fc..75cb6dd 100644
--- a/docs/processes.html
+++ b/docs/processes.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/statsfunctions.html b/docs/statsfunctions.html
index cef4e4c..587ead5 100644
--- a/docs/statsfunctions.html
+++ b/docs/statsfunctions.html
@@ -17,7 +17,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
@@ -101,4 +101,4 @@ setInterval(function() {
   </script>
 </body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/system.html b/docs/system.html
index bc8dd3c..b6b6393 100644
--- a/docs/system.html
+++ b/docs/system.html
@@ -21,7 +21,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
diff --git a/docs/trademarks.html b/docs/trademarks.html
index 4e1f21c..cf4f719 100644
--- a/docs/trademarks.html
+++ b/docs/trademarks.html
@@ -17,7 +17,7 @@
 </head>
 
 <body>
-  <nav class="nav" style="background-image: url('./assets/trianglify.png');">
+  <nav class="nav" style="background-image: url('./assets/title-empty.jpg');">
     <div class="container">
       <a href="."><img class="logo float-left" src="assets/logo.png">
         <div class="title float-left">systeminformation</div>
