53
2 months later
16 days later

Many website support dark mode but we need extra extension for those which dosen't support. If we have in built dark mode which take care of performance as well as beautiful dark UI then it will help many of us who really like dark UI on every websie.

    i was just about to post about this! Yea, currently im using the extension dark reader because even with orion preferences set to dark mode, not all websites get dark mode, thats why i got the extension, however the extension is not exactly light weight and having it built in would have been more convenient

    • Vlad replied to this.
      Merged 4 posts from Dark mode by default.
        4 months later

        The dark mode script that's available via the Programmable button seems to work well enough and is very fast. Maybe that could be added to Website Settings? Seems to me that all the necessary functionality exists in Orion, just needs to be combined.

        • Vlad replied to this.

          Xyth It is fast and small but not comprehensive. This is why we open sourced it and made avaialble through Programmable buttons but I do not think we would advertise this as a Orion-level standard of quality to be included in the default menu.

            7 months later

            Vlad It kind of works? Not really as well as Dark Reader, and since it relies on injecting inline styles, it won't work on sites with strict CSPs, like addy.io.

            On Hetzner, it makes some elements actually brighter:

            I believe Dark Reader prevents this by checking the actual rendered hues and adjusting accordingly. Noir for Safari darkens images instead of inverting their colours, which I think is the best approach.

            • Vlad replied to this.

              httpjames Yes and this is why dark reader has to inject 4MB of js into every page you visit. Our code is 500 bytes. I was hoping it will be good enough as we do not want to bloat the browser to do this.

                Vlad This works perfectly fine for me. It's possible to implement it as Darkmode switch for websites?

                • Vlad replied to this.

                  kecinzer You can already add it as a programmable button in Orion

                    Vlad DarkReader publishes an NPM package comprising some version of the core logic, available as a UMD or ES module. The latter weighs 330KB (110KB minified). In both Firefox and Orion I've configured a userscript to inject the script at "document-start". It works well enough for me (there is no non-dark FOUC). Firefox DevTools seems to indicate the performance impacts are modest (~40ms on my 11th Gen laptop), though I don't know exactly what the target is here (certainly the script is not 500 bytes). The code is MIT-licensed. Perhaps this module could be the basis of a sufficiently performant dark mode function?

                    In lieu of that, if anyone what like to implement something similar, see these userscripts for reference:
                    https://greasyfork.org/scripts/466058-dark-reader
                    https://github.com/darkreader/darkreader/issues/926#issuecomment-575893299

                    • Vlad replied to this.

                      BingLee Thanks, great info. Would you be able to upload a programmable button using the script here so others can try?

                        Vlad I'm not sure exactly what you mean by "programmable button". Do you mean a bookmarklet, or a userscript that inserts a toggle button in the page?

                        • Vlad replied to this.
                          3 months later

                          The Dark Reader extension on MacOS and especially iOS/iPadOS is regularly buggy and one of the most cited reasons for people not using Orion. Dark mode extensions also require a lot of permissions and so are a potentially privacy / security vulnerability.

                          Please consider adding a native feature that can force dark mode on every website with keyboard shortcuts / an easy way to toggle on and off in both MacOS and iOS. The Noir app has one of the cleanest UIs and in my opinion works better than Dark Reader and could serve as a template.

                          Basic Requirements:

                          1. Can automatically detect (a) system dark mode settings and (b) if a website has a built-in dark mode.
                          2. Can override website built-in dark mode if detection is wrong.
                          3. Ability to turn on/off globally and for a specific website.
                          4. Ability to turn on/off via (1) Menu placement next to Reader Mode, (2) Keyboard shortcut similar to Reader Mode, (3) Gestures.

                          Optional Features:

                          1. Ability to customize Dark Mode via themes (e.g. Dark, Black, Gray, Sepia) or granular settings
                          2. Ability to "Disable until Tomorrow" for a specific website
                          3. Ability to set for "this website" vs. "this URL" i.e. for the domain name vs. the specific URL for even more customizability.
                            Merged 1 post from Add Native Dark Mode for every website (e.g. Dark Reader).

                              @Vlad FWIW this is especially valuable for iOS / iPadOS where the Dark Reader extension remains really buggy and where keyboard shortcuts to toggle on and off continue not to work. Also, the programmable button workaround doesn’t apply to iOS / iPad OS.

                              Relatedly, being able to toggle dark mode on/off with a gesture would be a meaningful improvement even over Safari with Noir / Dark Reader.

                              The lack of robust dark mode support across platforms remains my single biggest obstacle to going all-in on Orion over alternatives such as Safari.

                              • Vlad replied to this.