$main-theme-color: #ae91e8; //$main-theme-color: #8686CB; $main-bg-color: #28252E; $body-bg-color: darken($main-bg-color, 5%); $anchor-color: $main-theme-color; $main-text-color: #FFF; $border-color: lighten($body-bg-color, 10%); $secondary-text-color: white; $toast-border: #fafafa; $toast-bg: #333; $focus-outline: lighten($main-theme-color, 50%); $compose-background: lighten($main-theme-color, 52%); // override scrollbar color to make it a bit darker $scrollbar-face: #{lighten($main-theme-color, 3%)}; $scrollbar-face-hover: #{lighten($main-theme-color, 5%)}; $scrollbar-face-active: #{lighten($main-theme-color, 1%)}; @import "_base.scss"; @import "_dark.scss"; @import "_dark_navbar.scss"; @import "_dark_scrollbars.scss"; :root { accent-color: #{darken($main-theme-color, 12%)}; --button-primary-bg: #{$main-theme-color}; --button-primary-text: #141414; }