On September 13, 2019 (or some time near depending on your timezone) Slack finally launched official dark mode support for browser and desktop clients. (https://twitter.com/SlackHQ/status/1172165133956603904) You can change the settings now in-app, from Themes in Preferences. Thanks Slack!
As of August 23, 2019 (or some time near), Slack seems to have updated their stylesheet to use CSS variables in colors instead of using static ones, perhaps as if to lay out the foundation for themable 'dark mode' support. I've also found that they already include an alternative color palette for dark theme! Which essentially brings official support for dark mode for desktop and web—just not announced for public yet.So until that day finally comes, this theme will continue to exist but in a much more simplified form, where we just enable the dark theme color palette. Also keeps some little overrides for some parts that seemingly are still WIP darkification by Slack team.
Dark mode css stylesheet for Slack desktop app (4.0.1+)
Reverse-engineers the Slack for Desktop CSS file to convert all instances of colors used to variables, then inverse graytones to work as "dark mode", then applying human-revised changes for optimal design and usability.
I made it from scratch because none of the existing dark-mode css files coming along with existing dark-mode patchers met my quality standards of being usable (no loose ends)
Currently at about 95% coverage for UIs. Still improving bits and pieces here and there where it may look weird. (borders being too dark and stuff)
If you see any critical issues (such as text inputs backgrounds being white and text being not visible) please file an issue to let me know and I'll try to fix asap.
This project is not affiliated with Slack at all. This is a hobby project therefore development may halt at any given point—especially if Slack finally starts to officially ship dark mode option in their Desktop app.
So far this is the only method that works on latest version (4.0+). Follow instructions in the repository readme.
Replace the dark-theme.css file with the one provided in this (slack-4-dark-css) repository.
- Make sure to have a clean installation of Slack from App Store (Open Slack > About Slack > check
Version 4.0.1 (App Store)) - Download patcher ZIP file by LanikSJ, extract to desktop - Download
- Download latest CSS file and save to Desktop/slack-dark-mode (overwrite existing file) - Download
- Open Terminal.app
- Install Xcode command line tools -
xcode-select --install - Install nvm -
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash - Reload terminal -
source ~/.bash_profile - Install node -
nvm install stable - Navigate to folder in terminal -
cd ~/Desktop/slack-dark-mode - Edit permissions for script to run -
chmod +x ./slack-dark-mode.sh - Run patcher script -
./slack-dark-mode.sh - Refresh Slack app (Cmd+R) or restart
If there is an easier way to patch stylesheet without having to install all the developer dependencies (NodeJS), please let me know.
Use your favorite userstyle extension on your browser to override default stylesheet. Create a new userstyle to target your Slack app domain (https://app.slack.com/), then copy-paste the CSS file contents to apply.
npm install -g less
lessc dark-theme.less dark-theme.css