diff --git a/ui/public/config.json b/ui/public/config.json
index ed64b15423b..57d120aed5e 100644
--- a/ui/public/config.json
+++ b/ui/public/config.json
@@ -14,6 +14,8 @@
   "logo": "assets/logo.svg",
   "minilogo": "assets/mini-logo.svg",
   "banner": "assets/banner.svg",
+  "loginPageTitle": "CloudStack",
+  "loginPageFavicon": "assets/logo.svg",
   "error": {
     "403": "assets/403.png",
     "404": "assets/404.png",
diff --git a/ui/public/index.html b/ui/public/index.html
index 54ec6da25d1..1a09e46a4e0 100644
--- a/ui/public/index.html
+++ b/ui/public/index.html
@@ -22,8 +22,8 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>cloud.ico">
-    <title>Apache CloudStack</title>
+    <link id="favicon" rel="icon" href="<%= BASE_URL %>cloud.ico">
+    <title id="title" >Apache CloudStack</title>
     <style>
       .loader {
         border: 16px solid #F3F3F3;
@@ -54,4 +54,12 @@
       <div class="loader"></div>
     </div>
   </body>
+  <script type="text/javascript">
+    fetch('./config.json')
+      .then(response => response.json())
+      .then(data => {
+        document.getElementById("favicon").setAttribute("href", data.loginPageFavicon);
+        document.getElementById("title").innerHTML = data.loginPageTitle;
+      }).catch((err) => {});
+  </script>
 </html>