[Feature Request] Dark Mode

[misspent]

Dark mode option in the settings would be nice.

Example - Coloured icons is personal preference, I did this because I'm a freak :)

CSS Code that made the example above possible

```css * { /* Makes everything sqaure */ border-radius: 0px !important; } body { background-color: #151515 !important; } /* Search input text colour */ section#search input { color: #ccc !important; } /* Switch icon at the top */ .fa-toggle-on:before { color: crimson !important; /* Makes it green because of the invert(1) */ } .fa-toggle-off:before { color: cyan !important; } /* Header */ section#header a#title { color: #4a74b5; } section#header { vertical-align: middle !important; margin-top: -5px !important; margin-bottom: 3px !important; background: #202020 !important; } section#header a.page[href="options.html"], section#header a.page[href="profiles.html"], section#header a.page[href="chrome://extensions"], section#header a.switch { filter: invert(1) !important; } .fa-twitter:before { filter: brightness(1.1) !important; } .fa-facebook-official:before { filter: brightness(1.5) !important; } section#content h1 { /* Extensions "group" colour (I think) */ background-color: #4d668b !important; background-image: -webkit-linear-gradient(top,#4d668b,#2b3e5c) !important; } /* Main section */ section#content ul li { color: #ccc !important; padding: 3px 2px !important; cursor: pointer !important; } section#content ul li:hover { color: cornflowerblue !important; text-shadow: none !important; background-color: #252525 !important; box-shadow: none !important; } section#content li.disabled { background-color: #410d0d !important; color: #ccc !important; opacity: .7 !important; } section#content li.disabled:hover { background-color: #410d0d !important; } /* Settings icons to the right of extension */ .fa-gear:before { color: #d67a0a; } ```

[ryanwwest]

I want this too but the CSS is cool. How did you get the CSS code to apply to the extension? Is it a customizable setting within Extensity or some way to add CSS (and maybe HTML/JS) on top of an extension?

[misspent]

I want this too but the CSS is cool. How did you get the CSS code to apply to the extension? Is it a customizable setting within Extensity or some way to add CSS (and maybe HTML/JS) on top of an extension?

I downloaded the code from here, extracted it, opened the index.css file (example: Downloads\Extensity\styles (file is located in styles folder), made the code I posted above (all you'll have to do it paste it in) and went to extensions settings in my browser, activated dev tools, so I could import unpacked extension/folders, deleted the one I downloaded from chrome store and poof it went dark.

I doubt it'll auto-update like this, as I've not read anything hinting towards auto-updates when you “upload it” into your browser yourself. However, I doubt it'll break anytime soon + given the fact that it's open source, updating it yourself will be easy.

[Axer128]

+1 . One of the few extensions i use often that still blinds me in the options screen.

Annoying google doesn't allow those to be styled with something like dark reader, so yea the author has to implement the option.

[ylluminate]

Looks like someone started a fork that kinda petered out: https://github.com/diluteoxygen/Rextensity

It would be awesome to see a fork of this project (or this one) that could keep this kind of effort going and up-to-date.

I have to think that there's just no benefits in the Chrome extension ecosystem to see so many wonderful extensions just essentially die or languish.

[sergiokas]

If anyone can create a PR with a dark mode option I'll merge and publish it.

Requirements:

• Manual option OR prefers-color-scheme to autodetect (not both)
• Bump the version in the manifest please
• Keep the palette minimal (shades of gray, extension icons have too many colors already)

[sergiokas]

I just implemented this in the last release. Closing.