diff --git a/src/UI/Content/theme.less b/src/UI/Content/theme.less
index 2db082620..ad5aeb442 100644
--- a/src/UI/Content/theme.less
+++ b/src/UI/Content/theme.less
@@ -138,6 +138,35 @@ body {
   }
 }
 
+body.debug {
+  &:after {
+    background-color: #222222;
+    color: white;
+    text-transform: uppercase;
+    padding: 17px 25px;
+    position: fixed;
+    font-size: 15px;
+    font-weight: bold;
+    bottom: 0;
+    right: 0;
+    opacity:.9;
+    z-index: 9999;
+    content: "X-Small";
+
+    @media (min-width: @screen-sm-min) {
+      content: "Small";
+    }
+
+    @media (min-width: @screen-md-min) {
+      content: "Medium";
+    }
+
+    @media (min-width: @screen-lg-min) {
+      content: "Large";
+    }
+  }
+}
+
 .footer {
   font-size       : 13px;
   font-weight     : lighter;
diff --git a/src/UI/main.js b/src/UI/main.js
index c8b73434b..f9ee67993 100644
--- a/src/UI/main.js
+++ b/src/UI/main.js
@@ -30,7 +30,7 @@ new Router();
 var app = new Marionette.Application();
 
 app.addInitializer(function() {
-    console.log('starting application');
+    console.log("starting application");
 });
 
 app.addInitializer(SignalRBroadcaster.appInitializer, { app : app });
@@ -40,21 +40,34 @@ app.addInitializer(Tooltip.appInitializer, { app : app });
 app.addInitializer(function() {
     Backbone.history.start({
         pushState : true,
-        root      : ServerStatusModel.get('urlBase')
+        root      : ServerStatusModel.get("urlBase")
     });
     RouteBinder.bind();
     AppLayout.navbarRegion.show(new NavbarLayout());
-    $('body').addClass('started');
+    $("body").addClass("started");
 });
 
 app.addInitializer(UiSettingsController.appInitializer);
 
 app.addInitializer(function() {
-    var footerText = ServerStatusModel.get('version');
-    if (ServerStatusModel.get('branch') !== 'master') {
-        footerText += '<br>' + ServerStatusModel.get('branch');
+    var isDebug = ServerStatusModel.get("isDebug");
+    var isProduction = ServerStatusModel.get("isProduction");
+
+    if (isDebug === true) {
+        $("body").addClass("debug");
+    }
+
+    if (isProduction === true) {
+        $("body").addClass("production");
+    }
+});
+
+app.addInitializer(function() {
+    var footerText = ServerStatusModel.get("version");
+    if (ServerStatusModel.get("branch") !== "master") {
+        footerText += "<br>" + ServerStatusModel.get("branch");
     }
-    $('#footer-region .version').html(footerText);
+    $("#footer-region .version").html(footerText);
 });
 
 app.start();