Giter Site home page Giter Site logo

slack-dark-theme's Introduction

logo

How to add the dark theme to slack

  1. Locate Slack's ssb-interop.js file
    • For PC users, go to your version (your own username and current app version) of C:\Users\username\AppData\Local\slack\app-3.1.0\resources\app.asar.unpacked\src\static Note that if your slack client updates (it does this quietly without telling you), you'll need to do this process again for the updated version.
    • For Linux users, using the slack desktop (beta) navigate to /lib/slack/resources/app.asar.unpacked/src/static
    • Mac users, go to your version of /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static
  2. open ssb-interop.js with your editor of choice.
  3. Add this code to the end of ssb-interop.js and save:
document.addEventListener('DOMContentLoaded', function () {
    $.ajax({
        url: 'https://raw.githubusercontent.com/earlduque/Slack-Dark-Theme/master/dark.css',
        success: function (css) {
            $("<style></style>").appendTo('head').html(css);
        }
    });
});
  1. close and reopen slack

Further, I like this as the sidebar coloring:

  1. on the channel list at the top, click on your name and go to preferences
  2. click on sidebar
  3. scroll down and click on advanced/custom theme
  4. paste this into the custom theme input box: #363636,#444A47,#D39B46,#FEFEFE,#434745,#FEFEFE,#99D04A,#DB6668
  5. Or just copy and paste the code block above into any chat message to yourself or another person. Then you will see a button appear saying "Switch sidebar theme"

What it looks like

dark theme example

slack-dark-theme's People

Contributors

earlduque avatar calderaricaio avatar verascity avatar bhensley avatar speaud avatar ciprianna avatar gabrielgs avatar j4rodm avatar michaelcurry avatar zaccharles avatar kcimpulse avatar notdrone avatar

Watchers

James Cloos avatar Eduardo Telaya avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.