diff --git a/package.json b/package.json
index 80d27645a2..ecd20e103f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "busy",
-  "version": "2.5.4",
+  "version": "2.5.5",
   "engines": {
     "node": ">=7.10.1",
     "npm": "=5.3.0"
diff --git a/src/client/Wrapper.js b/src/client/Wrapper.js
index c424a40f64..c51e8f5586 100644
--- a/src/client/Wrapper.js
+++ b/src/client/Wrapper.js
@@ -156,6 +156,14 @@ export default class Wrapper extends React.PureComponent {
     }
   }
 
+  componentDidUpdate() {
+    if (this.props.nightmode) {
+      document.body.classList.add('nightmode');
+    } else {
+      document.body.classList.remove('nightmode');
+    }
+  }
+
   async loadLocale(locale) {
     let activeLocale = locale;
     if (activeLocale === 'auto') {
@@ -205,17 +213,14 @@ export default class Wrapper extends React.PureComponent {
   }
 
   render() {
-    const { user, usedLocale, translations, nightmode } = this.props;
+    const { user, usedLocale, translations } = this.props;
 
     const language = findLanguage(usedLocale);
 
     return (
       <IntlProvider key={language.id} locale={language.localeData} messages={translations}>
         <LocaleProvider locale={enUS}>
-          <Layout
-            className={nightmode ? 'dark' : ''}
-            data-dir={language && language.rtl ? 'rtl' : 'ltr'}
-          >
+          <Layout data-dir={language && language.rtl ? 'rtl' : 'ltr'}>
             <Layout.Header style={{ position: 'fixed', width: '100%', zIndex: 1050 }}>
               <Topnav username={user.name} onMenuItemClick={this.handleMenuItemClick} />
             </Layout.Header>
diff --git a/src/client/activity/UserActivityActions-nightmode.less b/src/client/activity/UserActivityActions-nightmode.less
new file mode 100644
index 0000000000..dd890a6560
--- /dev/null
+++ b/src/client/activity/UserActivityActions-nightmode.less
@@ -0,0 +1,72 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/mixins.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .UserActivityActions {
+    background-color: @grey-nero;
+
+    &__action {
+      color: @grey-nightRider;
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+
+      &:nth-of-type(2) {
+        border-top: @border-width-base @border-style-base @normal-grey;
+      }
+
+      @media @small {
+        border-right: @border-width-base @border-style-base @normal-grey;
+        border-left: @border-width-base @border-style-base @normal-grey;
+      }
+    }
+
+    &__loader {
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+
+      @media @small {
+        border-right: @border-width-base @border-style-base @normal-grey;
+        border-left: @border-width-base @border-style-base @normal-grey;
+      }
+    }
+
+    &__icon {
+      &__container {
+        color: @blue-heather;
+        background-color: @blue-solitude;
+      }
+    }
+
+    &__content {
+      &__message {
+        color: @white-gainsboro;
+      }
+    }
+
+    &__contents {
+      background: @grey-gondola;
+      border: @border-width-base @border-style-base @normal-grey;
+      color: @blue-heather;
+
+      &__item {
+        border: @border-width-base @border-style-base @normal-grey;
+      }
+
+      &__value {
+        border-top: @border-width-base @border-style-base @normal-grey;
+      }
+
+      &__label {
+        background: @grey-gondola;
+        border-top: @border-width-base @border-style-base @normal-grey;
+      }
+    }
+
+    @media @small {
+      &__contents {
+        &__label {
+          border-top: @border-width-base @border-style-base @normal-grey;
+        }
+      }
+    }
+  }
+}
diff --git a/src/client/activity/UserActivityActions.less b/src/client/activity/UserActivityActions.less
index f3f3c5dfdd..2fcf8f536d 100644
--- a/src/client/activity/UserActivityActions.less
+++ b/src/client/activity/UserActivityActions.less
@@ -191,3 +191,5 @@ div[data-dir='rtl'] .UserActivityActions {
     padding-right: 10px;
   }
 }
+
+@import 'UserActivityActions-nightmode';
diff --git a/src/client/activity/UserActivitySearch-nightmode.less b/src/client/activity/UserActivitySearch-nightmode.less
new file mode 100644
index 0000000000..cf41cf036f
--- /dev/null
+++ b/src/client/activity/UserActivitySearch-nightmode.less
@@ -0,0 +1,23 @@
+@import (reference) '../styles/custom.less';
+
+.nightmode {
+  .UserActivitySearch {
+    &__filters {
+      &__title {
+        color: @white-smoke;
+
+        &__icon {
+          color: @blue-botticelli;
+        }
+      }
+
+      &__content {
+        color: @grey-mortar;
+      }
+
+      &__divider {
+        background-color: @white-gainsboro;
+      }
+    }
+  }
+}
diff --git a/src/client/activity/UserActivitySearch.less b/src/client/activity/UserActivitySearch.less
index 8de64a0420..291be982cd 100644
--- a/src/client/activity/UserActivitySearch.less
+++ b/src/client/activity/UserActivitySearch.less
@@ -67,3 +67,5 @@ div[data-dir='rtl'] .UserActivitySearch {
     }
   }
 }
+
+@import 'UserActivitySearch-nightmode';
diff --git a/src/client/components/Avatar-nightmode.less b/src/client/components/Avatar-nightmode.less
new file mode 100644
index 0000000000..ed40d38398
--- /dev/null
+++ b/src/client/components/Avatar-nightmode.less
@@ -0,0 +1,7 @@
+@import (reference) '../styles/custom.less';
+
+.nightmode {
+  .Avatar {
+    border: @border-width-base @border-style-base @normal-grey;
+  }
+}
diff --git a/src/client/components/Avatar.less b/src/client/components/Avatar.less
index 5766263908..8a8143291f 100644
--- a/src/client/components/Avatar.less
+++ b/src/client/components/Avatar.less
@@ -8,3 +8,5 @@
   background-position: 50% 50%;
   border: @base-border;
 }
+
+@import 'Avatar-nightmode';
diff --git a/src/client/components/BBackTop.less b/src/client/components/BBackTop.less
index 4e3fbc606b..3786e0570c 100644
--- a/src/client/components/BBackTop.less
+++ b/src/client/components/BBackTop.less
@@ -32,6 +32,9 @@
       line-height: 40px;
       background-color: white;
       border-radius: 50%;
+      height: 37px;
+      display: block;
+      width: 37px;
 
       &:hover {
         color: @blue-navyBlue !important;
diff --git a/src/client/components/Editor/Editor-nightmode.less b/src/client/components/Editor/Editor-nightmode.less
new file mode 100644
index 0000000000..d862559639
--- /dev/null
+++ b/src/client/components/Editor/Editor-nightmode.less
@@ -0,0 +1,9 @@
+@import (reference) '../../styles/custom.less';
+
+.nightmode {
+  .Editor {
+    &__label {
+      color: @white-smoke;
+    }
+  }
+}
diff --git a/src/client/components/Editor/Editor.less b/src/client/components/Editor/Editor.less
index 28ea35c7e7..3bd633e64e 100644
--- a/src/client/components/Editor/Editor.less
+++ b/src/client/components/Editor/Editor.less
@@ -120,3 +120,5 @@ div[data-dir='rtl'] .Editor {
     float: left;
   }
 }
+
+@import 'Editor-nightmode';
diff --git a/src/client/components/Editor/EditorToolbar-nightmode.less b/src/client/components/Editor/EditorToolbar-nightmode.less
new file mode 100644
index 0000000000..0a9333f31b
--- /dev/null
+++ b/src/client/components/Editor/EditorToolbar-nightmode.less
@@ -0,0 +1,23 @@
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/modules/variables.less';
+
+.nightmode {
+  .EditorToolbar {
+    background: @grey-nero;
+
+    &__button {
+      background: @grey-nero;
+      color: @blue-heather;
+      &:hover {
+        background: @normal-grey;
+        color: @white-smoke;
+      }
+    }
+  }
+
+  .EditorToolbar__container {
+    border: @border-width-base @border-style-base @normal-grey;
+    border-bottom: 0;
+    background: @grey-nero;
+  }
+}
diff --git a/src/client/components/Editor/EditorToolbar.less b/src/client/components/Editor/EditorToolbar.less
index 6f3d4eee68..3239b3d60b 100644
--- a/src/client/components/Editor/EditorToolbar.less
+++ b/src/client/components/Editor/EditorToolbar.less
@@ -46,3 +46,5 @@
   overflow-y: hidden !important;
   background: @component-background;
 }
+
+@import 'EditorToolbar-nightmode';
diff --git a/src/client/components/Navigation/Notifications/Notification-nightmode.less b/src/client/components/Navigation/Notifications/Notification-nightmode.less
new file mode 100644
index 0000000000..4fc5d46c29
--- /dev/null
+++ b/src/client/components/Navigation/Notifications/Notification-nightmode.less
@@ -0,0 +1,24 @@
+@import (reference) '../../../styles/custom.less';
+
+.nightmode {
+  .Notification {
+    background-color: @grey-nero;
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+
+    &--unread {
+      background-color: #32373c;
+    }
+
+    &__text {
+      &__message {
+        color: @grey-darkGrey;
+      }
+    }
+
+    &__empty {
+      border-bottom: @base-border;
+      color: @black;
+      justify-content: center;
+    }
+  }
+}
diff --git a/src/client/components/Navigation/Notifications/Notification.less b/src/client/components/Navigation/Notifications/Notification.less
index 11766d5fb3..c4f2a6b2cb 100644
--- a/src/client/components/Navigation/Notifications/Notification.less
+++ b/src/client/components/Navigation/Notifications/Notification.less
@@ -42,3 +42,5 @@
     border-bottom: 0 !important;
   }
 }
+
+@import 'Notification-nightmode';
diff --git a/src/client/components/Navigation/Notifications/Notifications-nightmode.less b/src/client/components/Navigation/Notifications/Notifications-nightmode.less
new file mode 100644
index 0000000000..c6a3017301
--- /dev/null
+++ b/src/client/components/Navigation/Notifications/Notifications-nightmode.less
@@ -0,0 +1,10 @@
+@import (reference) '../../../styles/custom.less';
+@import (reference) '../../../styles/modules/variables.less';
+
+.nightmode {
+  .Notifications {
+    &__footer {
+      border-top: @border-width-base @border-style-base @normal-grey;
+    }
+  }
+}
diff --git a/src/client/components/Navigation/Notifications/Notifications.less b/src/client/components/Navigation/Notifications/Notifications.less
index 00a3576aa8..03728779f4 100644
--- a/src/client/components/Navigation/Notifications/Notifications.less
+++ b/src/client/components/Navigation/Notifications/Notifications.less
@@ -35,3 +35,5 @@
     }
   }
 }
+
+@import 'Notifications-nightmode';
diff --git a/src/client/components/Navigation/Sidenav-nightmode.less b/src/client/components/Navigation/Sidenav-nightmode.less
new file mode 100644
index 0000000000..74d8ca6454
--- /dev/null
+++ b/src/client/components/Navigation/Sidenav-nightmode.less
@@ -0,0 +1,22 @@
+@import (reference) '../../styles/custom.less';
+
+.nightmode {
+  .Sidenav {
+    & > li {
+      & > a {
+        &:hover {
+          color: @white-smoke;
+        }
+      }
+    }
+  }
+
+  .Sidenav__item--active {
+    background: @grey-nero;
+    border: @border-width-base @border-style-base @normal-grey !important;
+    color: @white-smoke !important;
+    & > i {
+      color: @primary-color;
+    }
+  }
+}
diff --git a/src/client/components/Navigation/Sidenav.less b/src/client/components/Navigation/Sidenav.less
index 6cec8ad46e..83792b54ab 100644
--- a/src/client/components/Navigation/Sidenav.less
+++ b/src/client/components/Navigation/Sidenav.less
@@ -48,3 +48,5 @@ div[data-dir='rtl'] .Sidenav {
     color: @primary-color;
   }
 }
+
+@import 'Sidenav-nightmode';
diff --git a/src/client/components/Navigation/Topnav-dark.less b/src/client/components/Navigation/Topnav-dark.less
deleted file mode 100644
index 10e68f5ba3..0000000000
--- a/src/client/components/Navigation/Topnav-dark.less
+++ /dev/null
@@ -1,37 +0,0 @@
-@import (reference) '../../styles/modules/variables.less';
-@import (reference) '../../styles/custom.less';
-
-@base-spacing: 0;
-
-.dark {
-  .Topnav {
-    background-color: @grey-nero;
-    border-bottom: @normal-grey;
-
-    &__input-container {
-      input {
-        color: @white-smoke;
-        border: @border-width-base @border-style-base @normal-grey;
-
-        &:hover,
-        &:focus {
-          border: @border-width-base @border-style-base @normal-grey !important;
-        }
-      }
-    }
-
-    &__menu-container {
-      &__menu {
-        & > li.ant-menu-item {
-          & > a {
-            color: @tertiary-color !important;
-
-            &:hover {
-              color: @white-smoke !important;
-            }
-          }
-        }
-      }
-    }
-  }
-}
diff --git a/src/client/components/Navigation/Topnav-nightmode.less b/src/client/components/Navigation/Topnav-nightmode.less
new file mode 100644
index 0000000000..0b6c23c3f9
--- /dev/null
+++ b/src/client/components/Navigation/Topnav-nightmode.less
@@ -0,0 +1,63 @@
+@import (reference) '../../styles/modules/variables.less';
+@import (reference) '../../styles/custom.less';
+
+@base-spacing: 0;
+
+.nightmode {
+  .Topnav {
+    background-color: @grey-nero;
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+
+    &__input-container {
+      .ant-select-selection {
+        border: none !important;
+      }
+      input {
+        color: @white-smoke;
+        border: @border-width-base @border-style-base @normal-grey;
+
+        &:hover,
+        &:focus {
+          border: @border-width-base @border-style-base @normal-grey !important;
+        }
+      }
+    }
+
+    &__menu-container {
+      &__menu {
+        & > li.ant-menu-item {
+          & > a {
+            &:hover {
+              color: @white-smoke !important;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .Topnav__search-dropdown-container {
+    background: @grey-nero;
+  }
+
+  .Topnav__search-dropdown-container.ant-select-dropdown {
+    border-right: @border-width-base @border-style-base @normal-grey;
+    border-left: @border-width-base @border-style-base @normal-grey;
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .Topnav__search-autocomplete.ant-select-dropdown-menu-item-active {
+    &:hover {
+      background-color: #32373c;
+    }
+  }
+
+  .Topnav__search-autocomplete.ant-select-dropdown-menu-item {
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+    color: @white-smoke;
+  }
+
+  .Topnav__search-all-results {
+    background-color: @grey-nero;
+  }
+}
diff --git a/src/client/components/Navigation/Topnav.less b/src/client/components/Navigation/Topnav.less
index 817fd36d07..914f6e942e 100644
--- a/src/client/components/Navigation/Topnav.less
+++ b/src/client/components/Navigation/Topnav.less
@@ -287,4 +287,4 @@ div[data-dir='rtl'] .Topnav {
   justify-content: flex-end !important;
 }
 
-@import 'Topnav-dark';
+@import 'Topnav-nightmode';
diff --git a/src/client/components/QuickPostEditor/QuickPostEditor-nightmode.less b/src/client/components/QuickPostEditor/QuickPostEditor-nightmode.less
new file mode 100644
index 0000000000..c14ec00b9d
--- /dev/null
+++ b/src/client/components/QuickPostEditor/QuickPostEditor-nightmode.less
@@ -0,0 +1,32 @@
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/modules/variables.less';
+
+.nightmode {
+  .QuickPostEditor {
+    background-color: @grey-nero;
+    border-top: @border-width-base @border-style-base @normal-grey;
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+
+    &__contents {
+      background: @grey-nero;
+
+      .ant-input {
+        background-color: @grey-nero;
+        color: @white-smoke;
+        border: none !important;
+      }
+    }
+
+    &__header {
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+    }
+
+    &__footer {
+      border-top: @border-width-base @border-style-base @normal-grey;
+    }
+
+    @media @small {
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+  }
+}
diff --git a/src/client/components/QuickPostEditor/QuickPostEditor.less b/src/client/components/QuickPostEditor/QuickPostEditor.less
index 480071b497..59a54ebf8f 100644
--- a/src/client/components/QuickPostEditor/QuickPostEditor.less
+++ b/src/client/components/QuickPostEditor/QuickPostEditor.less
@@ -194,3 +194,5 @@ div[data-dir='rtl'] .QuickPostEditor {
     margin-right: 5px;
   }
 }
+
+@import 'QuickPostEditor-nightmode';
diff --git a/src/client/components/Sidebar/CryptoTrendingCharts-nightmode.less b/src/client/components/Sidebar/CryptoTrendingCharts-nightmode.less
new file mode 100644
index 0000000000..b16b6750e5
--- /dev/null
+++ b/src/client/components/Sidebar/CryptoTrendingCharts-nightmode.less
@@ -0,0 +1,25 @@
+@import (reference) '../../styles/custom.less';
+
+.nightmode {
+  .CryptoTrendingCharts {
+    &__chart-header {
+      color: @white-smoke;
+    }
+
+    &__usd-price {
+      color: @primary-color;
+    }
+
+    &__btc-price {
+      color: @blue-botticelli;
+    }
+
+    path.highcharts-graph {
+      stroke: @primary-color !important;
+    }
+
+    rect.highcharts-background {
+      background: @grey-nero !important;
+    }
+  }
+}
diff --git a/src/client/components/Sidebar/CryptoTrendingCharts.less b/src/client/components/Sidebar/CryptoTrendingCharts.less
index c898aa8df2..a10f182b09 100644
--- a/src/client/components/Sidebar/CryptoTrendingCharts.less
+++ b/src/client/components/Sidebar/CryptoTrendingCharts.less
@@ -77,3 +77,5 @@ div[data-dir='rtl'] .CryptoTrendingCharts {
     margin-left: 0;
   }
 }
+
+@import 'CryptoTrendingCharts-nightmode';
diff --git a/src/client/components/Sidebar/LastDrafts-nightmode.less b/src/client/components/Sidebar/LastDrafts-nightmode.less
new file mode 100644
index 0000000000..feb81a33b6
--- /dev/null
+++ b/src/client/components/Sidebar/LastDrafts-nightmode.less
@@ -0,0 +1,11 @@
+@import (reference) '../../styles/custom.less';
+
+.nightmode {
+  .LastDrafts {
+    &__draft {
+      & > a {
+        color: @white-smoke;
+      }
+    }
+  }
+}
diff --git a/src/client/components/Sidebar/LastDrafts.less b/src/client/components/Sidebar/LastDrafts.less
index 9ff4462d6f..e761276a89 100644
--- a/src/client/components/Sidebar/LastDrafts.less
+++ b/src/client/components/Sidebar/LastDrafts.less
@@ -27,3 +27,5 @@
     }
   }
 }
+
+@import 'LastDrafts-nightmode';
diff --git a/src/client/components/Sidebar/PostRecommendation-nightmode.less b/src/client/components/Sidebar/PostRecommendation-nightmode.less
new file mode 100644
index 0000000000..0762ce2d6a
--- /dev/null
+++ b/src/client/components/Sidebar/PostRecommendation-nightmode.less
@@ -0,0 +1,17 @@
+@import (reference) '../../styles/custom.less';
+
+.nightmode {
+  .PostRecommendation {
+    &__link {
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+
+      &__post-title {
+        color: @white-smoke;
+
+        &:hover {
+          color: @white-smoke !important;
+        }
+      }
+    }
+  }
+}
diff --git a/src/client/components/Sidebar/PostRecommendation.less b/src/client/components/Sidebar/PostRecommendation.less
index ad7a0f7aa0..f3fe1a1348 100644
--- a/src/client/components/Sidebar/PostRecommendation.less
+++ b/src/client/components/Sidebar/PostRecommendation.less
@@ -82,3 +82,5 @@
     }
   }
 }
+
+@import 'PostRecommendation-nightmode';
diff --git a/src/client/components/Sidebar/SidebarContentBlock-nightmode.less b/src/client/components/Sidebar/SidebarContentBlock-nightmode.less
new file mode 100644
index 0000000000..9dc17d3306
--- /dev/null
+++ b/src/client/components/Sidebar/SidebarContentBlock-nightmode.less
@@ -0,0 +1,24 @@
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/modules/variables.less';
+@import (reference) '../../styles/mixins';
+
+.nightmode {
+  .SidebarContentBlock {
+    .content-block();
+    background: @grey-nero;
+    border-color: @normal-grey !important;
+
+    &__title {
+      border-bottom: 1px @border-style-base @normal-grey;
+      color: @blue-baliHai;
+    }
+
+    &__icon {
+      color: @blue-baliHai;
+    }
+
+    &__divider {
+      background-color: @normal-grey;
+    }
+  }
+}
diff --git a/src/client/components/Sidebar/SidebarContentBlock.less b/src/client/components/Sidebar/SidebarContentBlock.less
index 02c739448a..d5229d081b 100644
--- a/src/client/components/Sidebar/SidebarContentBlock.less
+++ b/src/client/components/Sidebar/SidebarContentBlock.less
@@ -54,3 +54,5 @@ div[data-dir='rtl'] .SidebarContentBlock {
     margin-left: 5px;
   }
 }
+
+@import 'SidebarContentBlock-nightmode';
diff --git a/src/client/components/Sidebar/User-nightmode.less b/src/client/components/Sidebar/User-nightmode.less
new file mode 100644
index 0000000000..6e0aa71fb6
--- /dev/null
+++ b/src/client/components/Sidebar/User-nightmode.less
@@ -0,0 +1,12 @@
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/modules/variables.less';
+
+.nightmode {
+  .User__about {
+    color: #9d9d9d;
+  }
+
+  .User__divider {
+    background-color: @normal-grey;
+  }
+}
diff --git a/src/client/components/Sidebar/User.less b/src/client/components/Sidebar/User.less
index 0f7733463a..33998614ca 100644
--- a/src/client/components/Sidebar/User.less
+++ b/src/client/components/Sidebar/User.less
@@ -65,3 +65,5 @@ div[data-dir='rtl'] .User__name {
   margin: 12px 0;
   background-color: #e9e7e7;
 }
+
+@import 'User-nightmode';
diff --git a/src/client/components/Story/Body-nightmode.less b/src/client/components/Story/Body-nightmode.less
new file mode 100644
index 0000000000..4724939873
--- /dev/null
+++ b/src/client/components/Story/Body-nightmode.less
@@ -0,0 +1,48 @@
+@import (reference) '../../styles/modules/variables.less';
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/fonts.less';
+
+.nightmode {
+  .Body {
+    color: @white-smoke;
+
+    strong,
+    b {
+      color: @white-smoke;
+    }
+
+    // Quote and code
+
+    blockquote {
+      border-left: 1px solid rgba(255, 255, 255, 0.6);
+      color: @grey-darkGrey;
+    }
+
+    :not(pre) > code {
+      color: @grey-nightRider;
+      background-color: @white-smoke;
+    }
+
+    pre {
+      background-color: #2b3035;
+    }
+
+    // Table
+
+    table {
+      tr > th {
+        background-color: @post-table-background-color;
+      }
+
+      tr:nth-child(even) {
+        td {
+          background-color: @post-table-background-color;
+        }
+      }
+    }
+
+    hr {
+      border-bottom: @base-border;
+    }
+  }
+}
diff --git a/src/client/components/Story/Body.less b/src/client/components/Story/Body.less
index b91b3beee0..291e667e4e 100644
--- a/src/client/components/Story/Body.less
+++ b/src/client/components/Story/Body.less
@@ -248,3 +248,5 @@
 div[data-dir='rtl'] .Body {
   direction: ltr;
 }
+
+@import 'Body-nightmode';
diff --git a/src/client/components/Story/Story-nightmode.less b/src/client/components/Story/Story-nightmode.less
new file mode 100644
index 0000000000..dac66fc5e7
--- /dev/null
+++ b/src/client/components/Story/Story-nightmode.less
@@ -0,0 +1,27 @@
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/modules/variables.less';
+
+.nightmode {
+  .Story {
+    background-color: @grey-nero;
+    color: @white-smoke;
+    border-top: @border-width-base @border-style-base @normal-grey;
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+    @media @small {
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+
+    &__content {
+      &__preview {
+        color: @grey-darkGrey;
+
+        &:hover,
+        &:focus,
+        &:active,
+        &:visited {
+          color: @grey-darkGrey;
+        }
+      }
+    }
+  }
+}
diff --git a/src/client/components/Story/Story.less b/src/client/components/Story/Story.less
index f75bfac760..5aee105802 100644
--- a/src/client/components/Story/Story.less
+++ b/src/client/components/Story/Story.less
@@ -195,3 +195,5 @@ div[data-dir='rtl'] .Story {
     }
   }
 }
+
+@import 'Story-nightmode';
diff --git a/src/client/components/Story/StoryFull-nightmode.less b/src/client/components/Story/StoryFull-nightmode.less
new file mode 100644
index 0000000000..331fff4d36
--- /dev/null
+++ b/src/client/components/Story/StoryFull-nightmode.less
@@ -0,0 +1,19 @@
+@import (reference) '../../styles/modules/variables.less';
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/fonts.less';
+
+.nightmode {
+  .StoryFull {
+    &__reply {
+      border: @border-width-base @border-style-base @normal-grey;
+
+      & > &__title {
+        color: @white-smoke;
+      }
+    }
+
+    &__title {
+      color: @white-smoke;
+    }
+  }
+}
diff --git a/src/client/components/Story/StoryFull.less b/src/client/components/Story/StoryFull.less
index d2c545dd7c..60361bc40c 100644
--- a/src/client/components/Story/StoryFull.less
+++ b/src/client/components/Story/StoryFull.less
@@ -117,3 +117,5 @@ div[data-dir='rtl'] .StoryFull {
     }
   }
 }
+
+@import 'StoryFull-nightmode';
diff --git a/src/client/components/Story/StoryLoading-nightmode.less b/src/client/components/Story/StoryLoading-nightmode.less
new file mode 100644
index 0000000000..a1cd003ca6
--- /dev/null
+++ b/src/client/components/Story/StoryLoading-nightmode.less
@@ -0,0 +1,15 @@
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/modules/variables.less';
+
+.nightmode {
+  .StoryLoading {
+    background-color: @grey-nero;
+    color: @normal-grey;
+    border-top: @border-width-base @border-style-base @normal-grey;
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+
+    @media @small {
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+  }
+}
diff --git a/src/client/components/Story/StoryLoading.less b/src/client/components/Story/StoryLoading.less
index 39a341ca92..1761b85f6e 100644
--- a/src/client/components/Story/StoryLoading.less
+++ b/src/client/components/Story/StoryLoading.less
@@ -37,3 +37,5 @@
     padding: 4px 16px 16px;
   }
 }
+
+@import 'StoryLoading-nightmode';
diff --git a/src/client/components/UserCard-nightmode.less b/src/client/components/UserCard-nightmode.less
new file mode 100644
index 0000000000..1e04f27295
--- /dev/null
+++ b/src/client/components/UserCard-nightmode.less
@@ -0,0 +1,7 @@
+@import (reference) '../styles/custom.less';
+
+.nightmode {
+  .UserCard {
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+  }
+}
diff --git a/src/client/components/UserCard.less b/src/client/components/UserCard.less
index 38f3a40d9d..ff5870f70b 100644
--- a/src/client/components/UserCard.less
+++ b/src/client/components/UserCard.less
@@ -41,3 +41,5 @@ div[data-dir='rtl'] .UserCard {
     margin-right: 8px;
   }
 }
+
+@import 'UserCard-nightmode';
diff --git a/src/client/components/UserHeader-nightmode.less b/src/client/components/UserHeader-nightmode.less
new file mode 100644
index 0000000000..1f3aa10665
--- /dev/null
+++ b/src/client/components/UserHeader-nightmode.less
@@ -0,0 +1,7 @@
+@import (reference) '../styles/custom.less';
+
+.nightmode {
+  .UserHeader {
+    background-color: #191e23;
+  }
+}
diff --git a/src/client/components/UserHeader.less b/src/client/components/UserHeader.less
index 473e494d23..107df274e6 100644
--- a/src/client/components/UserHeader.less
+++ b/src/client/components/UserHeader.less
@@ -197,3 +197,5 @@
     padding: 30px 0;
   }
 }
+
+@import 'UserHeader-nightmode';
diff --git a/src/client/components/UserHeaderLoading-nightmode.less b/src/client/components/UserHeaderLoading-nightmode.less
new file mode 100644
index 0000000000..a4e65c746e
--- /dev/null
+++ b/src/client/components/UserHeaderLoading-nightmode.less
@@ -0,0 +1,7 @@
+@import (reference) '../styles/custom.less';
+
+.nightmode {
+  .UserHeaderLoading {
+    background-color: #191e23;
+  }
+}
diff --git a/src/client/components/UserHeaderLoading.less b/src/client/components/UserHeaderLoading.less
index 08b088071d..8ea24d1d26 100644
--- a/src/client/components/UserHeaderLoading.less
+++ b/src/client/components/UserHeaderLoading.less
@@ -60,3 +60,5 @@
     padding-left: 0;
   }
 }
+
+@import 'UserHeaderLoading-nightmode';
diff --git a/src/client/components/UserMenu-nightmode.less b/src/client/components/UserMenu-nightmode.less
new file mode 100644
index 0000000000..4f866f471e
--- /dev/null
+++ b/src/client/components/UserMenu-nightmode.less
@@ -0,0 +1,23 @@
+@import (reference) '../styles/custom.less';
+
+.nightmode {
+  .UserMenu {
+    background-color: @grey-nero;
+    border-top: solid 1px @normal-grey;
+    border-bottom: solid 1px @normal-grey;
+
+    &__item {
+      color: #99aab5;
+
+      &--active,
+      &:hover {
+        color: @primary-color;
+        border-bottom: 2px @border-style-base @primary-color;
+      }
+    }
+
+    &__badge {
+      color: #c2ccd3;
+    }
+  }
+}
diff --git a/src/client/components/UserMenu.less b/src/client/components/UserMenu.less
index e39090ec96..bbc712ef19 100644
--- a/src/client/components/UserMenu.less
+++ b/src/client/components/UserMenu.less
@@ -46,3 +46,5 @@ div[data-dir='rtl'] .UserMenu {
     margin-left: 16px;
   }
 }
+
+@import 'UserMenu-nightmode';
diff --git a/src/client/discover/Discover-nightmode.less b/src/client/discover/Discover-nightmode.less
new file mode 100644
index 0000000000..739b0fdc31
--- /dev/null
+++ b/src/client/discover/Discover-nightmode.less
@@ -0,0 +1,17 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables';
+
+.nightmode {
+  .Discover {
+    &__content {
+      background-color: @grey-nero;
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+
+    &__user {
+      &__divider {
+        background-color: @normal-grey;
+      }
+    }
+  }
+}
diff --git a/src/client/discover/Discover.less b/src/client/discover/Discover.less
index 42ade75e72..58684b2646 100644
--- a/src/client/discover/Discover.less
+++ b/src/client/discover/Discover.less
@@ -89,3 +89,5 @@
     height: 0;
   }
 }
+
+@import 'Discover-nightmode';
diff --git a/src/client/invite/Invite-nightmode.less b/src/client/invite/Invite-nightmode.less
new file mode 100644
index 0000000000..af5a0cfebf
--- /dev/null
+++ b/src/client/invite/Invite-nightmode.less
@@ -0,0 +1,13 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables';
+
+.nightmode {
+  .Invite {
+    background-color: @grey-nero;
+    border: @border-width-base @border-style-base @normal-grey;
+
+    &__icon-container {
+      background-color: #2b3035;
+    }
+  }
+}
diff --git a/src/client/invite/Invite.less b/src/client/invite/Invite.less
index 115ffc830a..b69557fad2 100644
--- a/src/client/invite/Invite.less
+++ b/src/client/invite/Invite.less
@@ -81,3 +81,5 @@
     min-width: 100px;
   }
 }
+
+@import 'Invite-nightmode';
diff --git a/src/client/notifications/Notifications-nightmode.less b/src/client/notifications/Notifications-nightmode.less
new file mode 100644
index 0000000000..2af3ff1c5b
--- /dev/null
+++ b/src/client/notifications/Notifications-nightmode.less
@@ -0,0 +1,21 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .NotificationsPage {
+    &__content {
+      .content-block();
+      border-top: @border-width-base @border-style-base @normal-grey;
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+
+      @media @small {
+        border: @border-width-base @border-style-base @normal-grey;
+      }
+
+      .Notification {
+        background-color: @grey-nero !important;
+        border-bottom: @border-width-base @border-style-base @normal-grey;
+      }
+    }
+  }
+}
diff --git a/src/client/notifications/Notifications.less b/src/client/notifications/Notifications.less
index fcac82fdc5..fedce6f2c0 100644
--- a/src/client/notifications/Notifications.less
+++ b/src/client/notifications/Notifications.less
@@ -46,3 +46,5 @@
     padding: 20px;
   }
 }
+
+@import 'Notifications-nightmode';
diff --git a/src/client/post/PostModal-nightmode.less b/src/client/post/PostModal-nightmode.less
new file mode 100644
index 0000000000..875f604ca6
--- /dev/null
+++ b/src/client/post/PostModal-nightmode.less
@@ -0,0 +1,29 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .ant-modal-mask {
+    background-color: rgba(25, 30, 35, 0.97) !important;
+  }
+
+  .PostModal {
+    .ant-modal-body {
+      background: @grey-nero;
+    }
+
+    &__back {
+      background: @grey-nero;
+      border-bottom: @base-border;
+    }
+
+    &__action {
+      background: @grey-nero;
+      color: @blue-heather !important;
+      border: @border-width-base @border-style-base @normal-grey;
+
+      &:hover {
+        color: @blue-heather !important;
+      }
+    }
+  }
+}
diff --git a/src/client/post/PostModal.less b/src/client/post/PostModal.less
index 7d5e521fc6..addac0ed3e 100644
--- a/src/client/post/PostModal.less
+++ b/src/client/post/PostModal.less
@@ -133,3 +133,5 @@
 .ant-modal-mask-hidden + .PostModal {
   display: none !important;
 }
+
+@import 'PostModal-nightmode';
diff --git a/src/client/post/Write/DraftRow-nightmode.less b/src/client/post/Write/DraftRow-nightmode.less
new file mode 100644
index 0000000000..967baa1a6d
--- /dev/null
+++ b/src/client/post/Write/DraftRow-nightmode.less
@@ -0,0 +1,9 @@
+@import (reference) '../../styles/custom.less';
+@import (reference) '../../styles/modules/variables.less';
+
+.nightmode {
+  .DraftRow {
+    background-color: @grey-nero;
+    border: @border-width-base @border-style-base @normal-grey;
+  }
+}
diff --git a/src/client/post/Write/DraftRow.less b/src/client/post/Write/DraftRow.less
index 98058fa530..1300a75145 100644
--- a/src/client/post/Write/DraftRow.less
+++ b/src/client/post/Write/DraftRow.less
@@ -76,3 +76,5 @@
     }
   }
 }
+
+@import 'DraftRow-nightmode';
diff --git a/src/client/search/Search-nightmode.less b/src/client/search/Search-nightmode.less
new file mode 100644
index 0000000000..32e12fca05
--- /dev/null
+++ b/src/client/search/Search-nightmode.less
@@ -0,0 +1,21 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .Search {
+    &__message-container {
+      background-color: @grey-nero;
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+
+    &__post {
+      border: @border-width-base @border-style-base @normal-grey;
+      background-color: @grey-nero;
+    }
+
+    &__user {
+      background-color: @grey-nero;
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+  }
+}
diff --git a/src/client/search/Search.less b/src/client/search/Search.less
index eb3f03a5c1..c8a6b3d898 100644
--- a/src/client/search/Search.less
+++ b/src/client/search/Search.less
@@ -80,3 +80,5 @@
     }
   }
 }
+
+@import 'Search-nightmode';
diff --git a/src/client/styles/common-nightmode.less b/src/client/styles/common-nightmode.less
new file mode 100644
index 0000000000..cf9e741eb2
--- /dev/null
+++ b/src/client/styles/common-nightmode.less
@@ -0,0 +1,137 @@
+@import (reference) './custom.less';
+
+body.nightmode {
+  background: #191e23;
+  color: @white-smoke;
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    color: @white-smoke;
+  }
+
+  .ant-slider-mark-text {
+    color: @grey-darkGrey;
+  }
+
+  .ant-radio-wrapper,
+  .ant-slider-mark-text-active {
+    color: @white-smoke;
+  }
+
+  .ant-radio-button-wrapper {
+    background: @grey-nero;
+    color: @white-smoke;
+  }
+
+  .ant-select {
+    color: @white-smoke;
+    .ant-select-arrow {
+      color: @white-smoke;
+    }
+    .ant-select-selection {
+      border: @border-width-base @border-style-base @normal-grey;
+      background-color: @grey-nero;
+    }
+  }
+
+  .ant-input {
+    background-color: @grey-nero;
+    color: @white-smoke;
+    border: @border-width-base @border-style-base @normal-grey !important;
+  }
+
+  .ant-checkbox-wrapper {
+    color: @white-smoke;
+  }
+
+  .ant-dropdown-menu {
+    background-color: @grey-nero;
+    border: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .ant-dropdown-menu-item:hover,
+  .ant-dropdown-menu-submenu-title:hover {
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      color: @grey-nero;
+    }
+  }
+
+  .ant-tooltip-inner {
+    border: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .ant-popover-inner {
+    background-color: @grey-nero;
+    border: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .ant-popover-arrow {
+    background-color: @grey-nero;
+    border-left: @border-width-base @border-style-base @normal-grey;
+    border-top: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .ant-form {
+    color: @blue-heather;
+  }
+
+  .ant-form-item {
+    color: @blue-heather;
+  }
+
+  .ant-form-explain,
+  .ant-form-extra {
+    color: @blue-heather;
+  }
+
+  .has-error .ant-form-explain,
+  .has-error .ant-form-split {
+    color: @red;
+  }
+
+  .ant-modal-header,
+  .ant-modal-content {
+    background-color: @grey-nero;
+    color: @white-smoke;
+  }
+
+  .ant-modal-header {
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .ant-modal-footer {
+    border-top: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .ant-input-group-addon {
+    background-color: @grey-nero;
+    border: @border-width-base @border-style-base @normal-grey;
+  }
+
+  .ant-modal-close {
+    color: @white-smoke;
+  }
+
+  .ant-form-item-label label,
+  .ant-modal-title {
+    color: @white-smoke;
+  }
+
+  .ant-tabs {
+    color: @white-smoke;
+  }
+
+  .username {
+    color: @white-smoke;
+    font-weight: 500;
+  }
+}
diff --git a/src/client/styles/common.less b/src/client/styles/common.less
index e71116fcc6..7df6a00ca0 100644
--- a/src/client/styles/common.less
+++ b/src/client/styles/common.less
@@ -102,6 +102,7 @@ body.post-modal .primary-modal {
   color: #9d9d9d;
   line-height: 36px;
   height: 36px;
+  border-bottom: @border-width-base @border-style-base @normal-grey;
 }
 
 .ant-popover-inner-content {
@@ -225,3 +226,5 @@ ul {
 .ant-message {
   z-index: @ant-message-z-index !important;
 }
+
+@import 'common-nightmode';
diff --git a/src/client/user/UserDynamicList-nightmode.less b/src/client/user/UserDynamicList-nightmode.less
new file mode 100644
index 0000000000..0c86d1c896
--- /dev/null
+++ b/src/client/user/UserDynamicList-nightmode.less
@@ -0,0 +1,14 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .UserDynamicList {
+    background: @grey-nero;
+    border-top: @border-width-base @border-style-base @normal-grey;
+    border-bottom: @border-width-base @border-style-base @normal-grey;
+
+    @media @small {
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+  }
+}
diff --git a/src/client/user/UserDynamicList.less b/src/client/user/UserDynamicList.less
index 60ca644c61..0aeff4f0a2 100644
--- a/src/client/user/UserDynamicList.less
+++ b/src/client/user/UserDynamicList.less
@@ -28,3 +28,5 @@
     }
   }
 }
+
+@import 'UserDynamicList-nightmode';
diff --git a/src/client/wallet/ClaimRewardsBlock-nightmode.less b/src/client/wallet/ClaimRewardsBlock-nightmode.less
new file mode 100644
index 0000000000..502af964db
--- /dev/null
+++ b/src/client/wallet/ClaimRewardsBlock-nightmode.less
@@ -0,0 +1,9 @@
+@import (reference) '../styles/custom.less';
+
+.nightmode {
+  .ClaimRewardsBlock {
+    &__reward {
+      color: @white-smoke;
+    }
+  }
+}
diff --git a/src/client/wallet/ClaimRewardsBlock.less b/src/client/wallet/ClaimRewardsBlock.less
index c88e95235b..24c2839c23 100644
--- a/src/client/wallet/ClaimRewardsBlock.less
+++ b/src/client/wallet/ClaimRewardsBlock.less
@@ -19,3 +19,5 @@
     }
   }
 }
+
+@import 'ClaimRewardsBlock-nightmode';
diff --git a/src/client/wallet/Transfer-nightmode.less b/src/client/wallet/Transfer-nightmode.less
new file mode 100644
index 0000000000..ec623bc0bd
--- /dev/null
+++ b/src/client/wallet/Transfer-nightmode.less
@@ -0,0 +1,36 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .Transfer {
+    &__amount {
+      &__input {
+        &:focus,
+        &:hover {
+          + .ant-input-group-wrapper {
+            .Transfer__usd-value {
+              border: @border-width-base @border-style-base @normal-grey;
+              border-right: 0;
+            }
+            .ant-input-group-addon {
+              border: @border-width-base @border-style-base @normal-grey;
+            }
+          }
+        }
+      }
+    }
+
+    .has-error {
+      .Transfer__amount {
+        .Transfer__usd-value {
+          border: @border-width-base @border-style-base @red-6 !important;
+          border-right: 0 !important;
+          border-left: 0 !important;
+        }
+        .ant-input-group-addon {
+          border: @border-width-base @border-style-base @red-6 !important;
+        }
+      }
+    }
+  }
+}
diff --git a/src/client/wallet/Transfer.less b/src/client/wallet/Transfer.less
index 174450a30c..bebd1c6850 100644
--- a/src/client/wallet/Transfer.less
+++ b/src/client/wallet/Transfer.less
@@ -92,3 +92,5 @@
     }
   }
 }
+
+@import 'Transfer-nightmode';
diff --git a/src/client/wallet/UserWalletSummary-nightmode.less b/src/client/wallet/UserWalletSummary-nightmode.less
new file mode 100644
index 0000000000..fa7b3930e9
--- /dev/null
+++ b/src/client/wallet/UserWalletSummary-nightmode.less
@@ -0,0 +1,35 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .UserWalletSummary {
+    border: @border-width-base @border-style-base @normal-grey;
+    background-color: @grey-nero;
+
+    &__item {
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+    }
+
+    &__icon {
+      color: @blue-baliHai;
+    }
+
+    &__label {
+      color: @white-smoke;
+    }
+
+    &__value {
+      color: @white-smoke;
+    }
+
+    &__reward {
+      &:after {
+        color: @blue-botticelli;
+      }
+    }
+
+    @media @small {
+      border: @border-width-base @border-style-base @normal-grey;
+    }
+  }
+}
diff --git a/src/client/wallet/UserWalletSummary.less b/src/client/wallet/UserWalletSummary.less
index 77a6b74cb9..a25626799d 100644
--- a/src/client/wallet/UserWalletSummary.less
+++ b/src/client/wallet/UserWalletSummary.less
@@ -74,3 +74,5 @@ div[data-dir='rtl'] .UserWalletSummary {
     text-align: left;
   }
 }
+
+@import 'UserWalletSummary-nightmode';
diff --git a/src/client/wallet/UserWalletTransactions-nightmode.less b/src/client/wallet/UserWalletTransactions-nightmode.less
new file mode 100644
index 0000000000..fd21199e85
--- /dev/null
+++ b/src/client/wallet/UserWalletTransactions-nightmode.less
@@ -0,0 +1,44 @@
+@import (reference) '../styles/custom.less';
+@import (reference) '../styles/modules/variables.less';
+
+.nightmode {
+  .UserWalletTransactions {
+    background-color: @grey-nero;
+
+    &__loader {
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+
+      &:nth-of-type(2) {
+        border-top: @border-width-base @border-style-base @normal-grey;
+      }
+
+      @media @small {
+        border-right: @border-width-base @border-style-base @normal-grey;
+        border-left: @border-width-base @border-style-base @normal-grey;
+      }
+    }
+
+    &__transaction {
+      color: @white-gainsboro;
+      border-bottom: @border-width-base @border-style-base @normal-grey;
+
+      &:nth-of-type(2) {
+        border-top: @border-width-base @border-style-base @normal-grey;
+      }
+
+      @media @small {
+        border-right: @border-width-base @border-style-base @normal-grey;
+        border-left: @border-width-base @border-style-base @normal-grey;
+      }
+    }
+
+    &__icon-container {
+      color: @blue-heather;
+      background-color: @blue-solitude;
+    }
+
+    &__content-recipient {
+      color: @white-smoke;
+    }
+  }
+}
diff --git a/src/client/wallet/UserWalletTransactions.less b/src/client/wallet/UserWalletTransactions.less
index 0d306b7bc1..3bd78a3f83 100644
--- a/src/client/wallet/UserWalletTransactions.less
+++ b/src/client/wallet/UserWalletTransactions.less
@@ -159,3 +159,5 @@ div[data-dir='rtl'] .UserWalletTransactions {
     margin-left: 0;
   }
 }
+
+@import 'UserWalletTransactions-nightmode';
diff --git a/src/common/routes.js b/src/common/routes.js
index c99930124a..ee0027af2a 100644
--- a/src/common/routes.js
+++ b/src/common/routes.js
@@ -57,6 +57,7 @@ const routes = [
       {
         path: '/editor',
         component: Editor,
+        exact: true,
       },
       {
         path: '/settings',
diff --git a/src/server/renderers/ssrRenderer.js b/src/server/renderers/ssrRenderer.js
index 872cd74cab..e00b964393 100644
--- a/src/server/renderers/ssrRenderer.js
+++ b/src/server/renderers/ssrRenderer.js
@@ -21,10 +21,13 @@ export default function renderSsrPage(store, html, assets, template, noindex) {
 
   const production = process.env.NODE_ENV === 'production';
 
+  const nightmode = preloadedState.settings.nightmode;
+
   return template({
     header,
     html,
     scripts,
     production,
+    nightmode,
   });
 }
diff --git a/templates/index.hbs b/templates/index.hbs
index b4112389ec..1f2cee0ae4 100644
--- a/templates/index.hbs
+++ b/templates/index.hbs
@@ -18,7 +18,7 @@
   </script> {{/if}}
 </head>
 
-<body>
+<body{{#if nightmode}} class="nightmode"{{/if}}>
   <div id="app">{{{html}}}</div>
   {{{scripts}}}
 </body>