diff --git a/stylesheets/_index.scss b/stylesheets/_index.scss
index 672319a6a..499e5d18f 100644
--- a/stylesheets/_index.scss
+++ b/stylesheets/_index.scss
@@ -79,8 +79,6 @@
 }
 
 .gutter {
-  background-color: $color-dark-85;
-
   ::-webkit-scrollbar-track {
     background: $color-dark-85;
   }
diff --git a/stylesheets/_mentions.scss b/stylesheets/_mentions.scss
index c32a70d55..aa3deaf77 100644
--- a/stylesheets/_mentions.scss
+++ b/stylesheets/_mentions.scss
@@ -1,3 +1,5 @@
+@import 'themes.scss';
+
 .leave-group-dialog {
   .content {
     max-width: 100% !important;
@@ -188,8 +190,9 @@
 }
 
 .at-symbol {
-  background-color: $session-color-green;
-
+  @include themify($themes) {
+    background-color: themed('accent');
+  }
   color: $color-black;
   text-align: center;
 
diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss
index b5a16d233..e91a91b33 100644
--- a/stylesheets/_session.scss
+++ b/stylesheets/_session.scss
@@ -109,7 +109,9 @@ textarea {
     color: $session-color-white;
 
     &:not(.disabled):hover {
-      filter: brightness(90%);
+      @include themify($themes) {
+        background: themed('clickableHovered');
+      }
     }
 
     &.green,
@@ -125,14 +127,26 @@ textarea {
     }
 
     &.green {
-      background-color: $session-color-green;
+      @include themify($themes) {
+        background-color: themed('accent');
+      }
     }
 
     &.white {
-      background-color: $session-color-white;
+      @include themify($themes) {
+        color: themed('textColor');
+      }
     }
     &.primary {
-      background-color: $session-color-primary;
+      @include themify($themes) {
+        background-color: themed('backgroundPrimary');
+      }
+
+      .session-icon {
+        @include themify($themes) {
+          fill: themed('foregroundPrimary');
+        }
+      }
     }
     &.secondary {
       background-color: $session-color-secondary;
@@ -154,7 +168,9 @@ textarea {
     border: none;
 
     &.green {
-      @include transparent-background($session-color-green);
+      @include themify($themes) {
+        @include transparent-background(themed('accent'));
+      }
     }
     &.white {
       @include transparent-background($session-color-white);
@@ -325,7 +341,9 @@ textarea {
 }
 
 .session-icon {
-  fill: $session-color-white;
+  @include themify($themes) {
+    fill: themed('textColor');
+  }
 }
 
 $session-separator-element-border: 1px solid $session-shade-6;
diff --git a/stylesheets/_session_constants.scss b/stylesheets/_session_constants.scss
index 2a0773970..fc7d64d35 100644
--- a/stylesheets/_session_constants.scss
+++ b/stylesheets/_session_constants.scss
@@ -73,7 +73,6 @@ $session-font-mono: 'SpaceMono';
 
 // Brand
 $session-color-green: #00f782;
-$session-color-green-alt-1: #00f480;
 
 // Shades
 $session-shade-1: #0c0c0c;
@@ -210,18 +209,3 @@ $session-fadein-duration: 0.1s;
 @mixin session-dark-background-hover {
   background-color: $session-shade-7;
 }
-@mixin session-filter-color-green {
-  filter: brightness(0) saturate(100%) invert(67%) sepia(69%) saturate(2367%)
-    hue-rotate(101deg) brightness(107%) contrast(101%);
-}
-
-$session-gradient-green: linear-gradient(
-  270deg,
-  rgba($session-color-green-alt-1, 1),
-  rgba($session-color-green-alt-1, 0.6)
-);
-$session-gradient-black: linear-gradient(
-  90deg,
-  rgba($session-shade-3, 1),
-  rgba($session-shade-4, 0.6)
-);
diff --git a/stylesheets/_session_left_pane.scss b/stylesheets/_session_left_pane.scss
index bf1f11383..61733000c 100644
--- a/stylesheets/_session_left_pane.scss
+++ b/stylesheets/_session_left_pane.scss
@@ -1,65 +1,50 @@
 $session-compose-margin: 20px;
 
-.module-conversation-list-item {
-  transition: $session-transition-duration;
-  @at-root .light-theme #{&} {
-    @include session-dark-background-lighter;
-    &:hover {
-      @include session-dark-background-hover;
-    }
-  }
-  @at-root .dark-theme #{&} {
-    @include session-dark-background-lighter;
-    &:hover {
-      @include session-dark-background-hover;
-    }
-  }
-
-  &--is-selected {
-    @at-root .light-theme #{&} {
-      @include session-dark-background-hover;
-      &:hover {
-        @include session-dark-background-hover;
-      }
-    }
-    @at-root .dark-theme #{&} {
-      @include session-dark-background-hover;
-      &:hover {
-        @include session-dark-background-hover;
-      }
-    }
-    .module-conversation__user__profile-number,
-    .module-conversation__user__profile-name,
-    .module-conversation-list-item__message__text {
-      @at-root .light-theme #{&} {
-        color: $session-color-black;
-      }
-      @at-root .dark-theme #{&} {
-        color: $session-color-white;
-      }
-    }
-  }
-}
 .gutter {
   width: 380px !important;
-  background: none !important;
   padding-right: 5px !important;
+  transition: $session-transition-duration;
+
+  @include themify($themes) {
+    background: themed('cellBackground');
+  }
 }
 
 .module-conversation {
   &-list-item {
+    transition: $session-transition-duration;
+
+    &:hover {
+      @include themify($themes) {
+        background: themed('clickableHovered');
+      }
+    }
+
+    &--is-selected {
+      @include themify($themes) {
+        background: themed('conversationItemSelected');
+      }
+
+      .module-conversation__user__profile-number,
+      .module-conversation__user__profile-name,
+      .module-conversation-list-item__message__text {
+        @include themify($themes) {
+          color: themed('textColor');
+        }
+      }
+    }
+
     &--has-unread {
       border-left: $session-element-border-green !important;
+      @include themify($themes) {
+        background: themed('conversationItemHasUnread');
+      }
     }
 
     &__unread-count {
-      @at-root .light-theme #{&} {
-        color: $session-color-black !important;
-        background-color: $session-color-white !important;
-      }
-      @at-root .dark-theme #{&} {
-        color: $session-color-white !important;
-        background-color: $session-shade-10 !important;
+      @include themify($themes) {
+        color: themed('textColor');
+        background-color: themed('clickableHovered');
       }
 
       position: static !important;
@@ -77,11 +62,8 @@ $session-compose-margin: 20px;
     &__message__text {
       color: $session-shade-17;
       &--has-unread {
-        @at-root .light-theme #{&} {
-          color: $session-shade-4 !important;
-        }
-        @at-root .dark-theme #{&} {
-          color: $session-color-white !important;
+        @include themify($themes) {
+          color: themed('textColor');
         }
       }
     }
@@ -100,11 +82,8 @@ $session-compose-margin: 20px;
 
     &__header__name--with-unread .module-conversation__user__profile-number,
     &__header__name--with-unread .module-conversation__user__profile-name {
-      @at-root .light-theme #{&} {
-        color: $session-color-black;
-      }
-      @at-root .dark-theme #{&} {
-        color: $session-color-white;
+      @include themify($themes) {
+        color: themed('textColor');
       }
     }
   }
@@ -115,38 +94,19 @@ $session-compose-margin: 20px;
       @include fontAccentBold();
       font-size: 15px;
 
-      @at-root .light-theme #{&} {
-        color: $session-color-white;
-      }
-      @at-root .dark-theme #{&} {
-        color: $session-shade-17;
+      @include themify($themes) {
+        color: themed('textColorSubtle');
       }
     }
   }
 }
 
-.inbox {
-  @at-root .light-theme #{&} {
-    color: $session-color-black;
-  }
-  @at-root .dark-theme #{&} {
-    @include session-dark-background;
-  }
-}
-
 .module-left-pane {
   border-right: 1px solid rgba($session-color-white, 0.1) !important;
   width: $session-left-pane-width;
   position: relative;
   height: -webkit-fill-available;
 
-  @at-root .light-theme #{&} {
-    background: $session-color-white !important;
-  }
-  @at-root .dark-theme #{&} {
-    background: $session-shade-4 !important;
-  }
-
   &-session {
     display: flex;
     height: 100vh;
@@ -157,6 +117,9 @@ $session-compose-margin: 20px;
     width: $session-left-pane-sections-container-width;
     display: inline-flex;
     flex-direction: column;
+    @include themify($themes) {
+      border-right: themed('borderActionPanel');
+    }
 
     .module-avatar,
     .session-icon-button {
@@ -183,13 +146,6 @@ $session-compose-margin: 20px;
     height: $main-view-header-height;
     padding-right: 7px;
 
-    @at-root .light-theme #{&} {
-      background-color: $session-color-white;
-    }
-    @at-root .dark-theme #{&} {
-      background-color: $session-shade-3;
-    }
-
     .session-button {
       margin-left: auto;
       @include fontAccentBold();
@@ -334,6 +290,11 @@ $session-compose-margin: 20px;
   display: flex;
   flex-direction: column;
   flex-grow: 1;
+  transition: $session-transition-duration;
+
+  @include themify($themes) {
+    background: themed('conversationList');
+  }
 
   .left-pane-contact-bottom-buttons .session-button {
     vertical-align: middle;
@@ -363,15 +324,6 @@ $session-compose-margin: 20px;
   display: inline-flex;
   flex-shrink: 0;
 
-  @at-root .light-theme #{&} {
-    color: $session-color-black;
-    background: $session-color-white;
-  }
-  @at-root .dark-theme #{&} {
-    color: $session-color-white;
-    background: $session-shade-4;
-  }
-
   .session-icon-button {
     margin: auto 10px;
   }
@@ -384,19 +336,11 @@ $session-compose-margin: 20px;
     font-size: $session-font-sm;
     font-family: $session-font-default;
     text-overflow: ellipsis;
+    background: none;
 
     &:focus {
       outline: none !important;
     }
-
-    @at-root .light-theme #{&} {
-      color: $session-color-black;
-      background: $session-color-white;
-    }
-    @at-root .dark-theme #{&} {
-      color: $session-color-white;
-      background: $session-shade-4;
-    }
   }
 }
 
@@ -413,13 +357,7 @@ $session-compose-margin: 20px;
   display: flex;
   flex-direction: row;
   width: 100%;
-
-  @at-root .light-theme #{&} {
-    background-color: $session-color-white;
-  }
-  @at-root .dark-theme #{&} {
-    background-color: $session-background;
-  }
+  background: none;
 
   .session-button.square-outline.square.green,
   .session-button.square-outline.square.white,
@@ -487,19 +425,6 @@ $session-compose-margin: 20px;
         background-color: $session-shade-5;
       }
 
-      &--has-friend-request {
-        &:first-child {
-          border-top: none !important;
-        }
-
-        border: 1px solid $session-shade-8 !important;
-
-        .module-conversation__user__profile-number,
-        .module-conversation__user__profile-name {
-          font-size: 13px !important;
-        }
-      }
-
       &__header__date,
       &__message {
         display: none;
@@ -616,16 +541,6 @@ $session-compose-margin: 20px;
   }
 }
 
-.friend-request-title {
-  font-weight: bold;
-  font-size: 13px;
-  padding: 11px;
-  border-right: 1px solid $session-shade-8 !important;
-  border-top: 1px solid $session-shade-8 !important;
-  border-left: 1px solid $session-shade-8 !important;
-  @include session-dark-background-lighter;
-}
-
 .panel-text-divider {
   width: 100%;
   text-align: center;
diff --git a/stylesheets/_session_theme.scss b/stylesheets/_session_theme.scss
index 260a26fd9..92219c89e 100644
--- a/stylesheets/_session_theme.scss
+++ b/stylesheets/_session_theme.scss
@@ -1,4 +1,5 @@
 // Messages
+@import 'themes.scss';
 
 .discussion-container {
   @at-root .light-theme #{&} {
@@ -15,12 +16,11 @@
 .module-conversation-header {
   @at-root .light-theme #{&} {
     background-color: $session-color-white;
-    border-bottom: none;
   }
   @at-root .dark-theme #{&} {
     background-color: $session-shade-4;
-    border-bottom: none;
   }
+  border-bottom: none;
 }
 
 .module-message {
@@ -39,6 +39,7 @@
   &__container--incoming {
     @at-root .light-theme #{&} {
       @include session-color-subtle($session-color-white);
+      background-color: $session-shade-8;
     }
     @at-root .dark-theme #{&} {
       background-color: $session-shade-8;
@@ -75,7 +76,9 @@
   &-selected {
     .module-message {
       &__container {
-        background-image: $session-gradient-green;
+        @include themify($themes) {
+          background-image: themed('messageSelected');
+        }
         box-shadow: $session-dark-shadow;
       }
 
@@ -91,7 +94,9 @@
 }
 
 .inbox {
-  background: linear-gradient(180deg, #171717 0%, $session-background 100%);
+  @include themify($themes) {
+    background: themed('inboxBackground');
+  }
 }
 
 .conversation {
@@ -113,7 +118,9 @@ h1 {
   margin: 0;
 
   &.active {
-    color: $session-color-white;
+    @include themify($themes) {
+      color: themed('textColor');
+    }
   }
 }
 
diff --git a/stylesheets/manifest.scss b/stylesheets/manifest.scss
index 900e6b993..19e96345a 100644
--- a/stylesheets/manifest.scss
+++ b/stylesheets/manifest.scss
@@ -1,4 +1,5 @@
 // Global Settings, Variables, and Mixins
+@import 'themes.scss';
 @import 'session_constants';
 @import 'variables';
 @import 'mixins';
diff --git a/stylesheets/themes.scss b/stylesheets/themes.scss
new file mode 100644
index 000000000..b72af57ab
--- /dev/null
+++ b/stylesheets/themes.scss
@@ -0,0 +1,108 @@
+// copy pasted from the android Session app. Some might not be used and some might be missing
+// also, some are sometimes applied with a opacity setting (most likely 0.6)
+$themes: (
+  light: (
+    accent: #00e97b,
+    destructive: #ff453a,
+    unimportant: #d8d8d8,
+    unimportantButtonBackground: #0000,
+    border: #979797,
+    cellBackground: #fcfcfc,
+    searchBarPlaceholder: #8e8e93,
+    searchBarBackground: #8e8e931f,
+    separator: #36383c,
+    buttonBackground: #fcfcfc,
+    modalBackground: #fcfcfc,
+    modalBorder: #212121,
+    fakeChatBubbleBackground: #f5f5f5,
+    fakeChatBubbleText: #000,
+    navigationBarBackground: #fcfcfc,
+    newConversationButtonShadow: hsl(151, 89%, 26%),
+    // text
+      textColor: #000,
+    textColorSubtle: #a0a0a0,
+    textColorOpposite: #fff,
+    // inbox
+      inboxBackground: #fff,
+    // buttons
+      backgroundPrimary: #272726,
+    foregroundPrimary: #fff,
+    // conversation view
+      messageSelected:
+      linear-gradient(270deg, rgba(#00f480, 1), rgba(#00f480, 0.6)),
+    composeViewBackground: #fcfcfc,
+    composeViewTextFieldBackground: #ededed,
+    receivedMessageBackground: #f5f5f5,
+    sentMessageBackground: #00e97b,
+    // left pane
+      conversationList: #fff,
+    conversationItemHasUnread: #fcfcfc,
+    conversationItemSelected: #f0f0f0,
+    clickableHovered: #dfdfdf,
+    borderActionPanel: 1px solid #f1f1f1,
+  ),
+  dark: (
+    accent: #00f782,
+    destructive: #ff453a,
+    unimportant: #d8d8d8,
+    unimportantButtonBackground: #323232,
+    border: #979797,
+    cellBackground: #1b1b1b,
+    searchBarPlaceholder: #8e8e93,
+    searchBarBackground: #8e8e931f,
+    separator: #36383c,
+    buttonBackground: #1b1b1b,
+    modalBackground: #101011,
+    modalBorder: #212121,
+    fakeChatBubbleBackground: #3f4146,
+    fakeChatBubbleText: #000,
+    navigationBarBackground: #161616,
+    newConversationButtonShadow: #077c44,
+    // text
+      textColor: #fff,
+    textColorSubtle: #a0a0a0,
+    textColorOpposite: #000,
+    // inbox
+      inboxBackground: linear-gradient(180deg, #171717 0%, #121212 100%),
+    // buttons
+      backgroundPrimary: #474646,
+    foregroundPrimary: #fff,
+    // conversation view
+      messageSelected:
+      linear-gradient(270deg, rgba(#00f480, 1), rgba(#00f480, 0.6)),
+    composeViewBackground: #1b1b1b,
+    composeViewTextFieldBackground: #141414,
+    receivedMessageBackground: #222325,
+    sentMessageBackground: #3f4146,
+    // left pane
+      conversationList: #1b1b1b,
+    conversationItemHasUnread: #2c2c2c,
+    conversationItemSelected: #404040,
+    clickableHovered: #414347,
+    borderActionPanel: none,
+  ),
+);
+
+@mixin themify($themes: $themes) {
+  @each $theme, $map in $themes {
+    .#{$theme}-theme & {
+      $theme-map: () !global;
+      @each $key, $submap in $map {
+        $value: map-get(map-get($themes, $theme), '#{$key}');
+        $theme-map: map-merge(
+          $theme-map,
+          (
+            $key: $value,
+          )
+        ) !global;
+      }
+
+      @content;
+      $theme-map: null !global;
+    }
+  }
+}
+
+@function themed($key) {
+  @return map-get($theme-map, $key);
+}
diff --git a/ts/components/session/ActionsPanel.tsx b/ts/components/session/ActionsPanel.tsx
index 04a0b7b99..8b603dabe 100644
--- a/ts/components/session/ActionsPanel.tsx
+++ b/ts/components/session/ActionsPanel.tsx
@@ -94,14 +94,14 @@ export class ActionsPanel extends React.Component<Props, State> {
     const handleClick = onSelect
       ? () => {
           /* tslint:disable:no-void-expression */
-        if (type === SectionType.Profile) {
-          this.editProfileHandle()
-        } else if (type === SectionType.Moon) {
-          window.toggleTheme();
-        } else {
-          onSelect(type);
-        }
-        /* tslint:enable:no-void-expression */
+          if (type === SectionType.Profile) {
+            this.editProfileHandle();
+          } else if (type === SectionType.Moon) {
+            window.toggleTheme();
+          } else {
+            onSelect(type);
+          }
+          /* tslint:enable:no-void-expression */
         }
       : undefined;