session-desktop/stylesheets/themes.scss

// 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,
    newConversationButtonShadow: hsl(151, 89%, 26%),
    // text
      textColor: #000,
    textColorSubtle: #a0a0a0,
    textColorOpposite: #fff,
    // inbox
      inboxBackground: #fff,
    // buttons
      backgroundPrimary: #272726,
    foregroundPrimary: #fff,
    buttonGreen: #272726,
    // 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,
    leftpaneOverlayBackground: #fff,
    // scrollbars
      scrollBarTrack: #fcfcfc,
    scrollBarThumb: #474646,
  ),
  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,
    newConversationButtonShadow: #077c44,
    // text
      textColor: #fff,
    textColorSubtle: #a0a0a0,
    textColorOpposite: #000,
    // inbox
      inboxBackground: linear-gradient(180deg, #171717 0%, #121212 100%),
    // buttons
      backgroundPrimary: #474646,
    foregroundPrimary: #fff,
    buttonGreen: #00f782,
    // 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,
    leftpaneOverlayBackground: linear-gradient(180deg, #171717 0%, #121212 100%),
    // scrollbars
      scrollBarTrack: #1b1b1b,
    scrollBarThumb: #474646,
  ),
);

@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);
}