Hacker News new | past | comments | ask | show | jobs | submit login
Ask HN: Please Dark Mode for HN
89 points by omot on April 29, 2021 | hide | past | favorite | 79 comments
Please. I instinctively go on HN all the time even when I'm in bed. I try to keep all my apps in dark mode and for the most part I've changed all my frequent apps except HN. It hurts my eyes. It hurts my soul a little bit. I like how the app hasn't changed for forever years, but please for the sake of my panache. I'll even built it myself if I could submit a PR.



As a workaround, I have been using Materialistic to browse HN from my Android phone. It has a nice dark theme, which I use by default.

https://github.com/hidroh/materialistic


Same, it's pretty great. Unfortunately it's suffering from some bitrot and the internal browser usually works for only about 50% of the articles.


Agreed, I have to open in the normal browser most of the time. Also if I want to see responses to my comments it doesn't show any of the context which is frustrating.


Love the app but it desperately needs an update (with a search function in comment view)


Here is dang's answer regarding this matter: https://news.ycombinator.com/item?id=23197966

edit: Updated comment and link to dang's answer


Open sourcing the code base might help. I'm sure there would be no shortage of pull requests to improve all sorts of things on this site that could be improved without too much effort. Plenty of more than qualified readers here. Of course that would increase dang's workload, which I can imagine is not something he's after. But he could fix that by delegating to some trusted people.

But, with a site this big, any change is going to make someone unhappy. So, I can appreciate his hands off approach here.


So we just need someone to take the time to re-colour news.css, and he'll pop it in there under a prefers dark css rule?

It seems a bunch of people have tried it. Some notes:

* Why have people given it a blue-ish tint? HN if anything has a warm tint. I think a neutral grey is most acceptable.

* People that are suggesting high contrast for mobile: On mobile you have a plethora of apps.

* People that are suggesting high contrast for accessibility: People with vision problems likely have some other thing to make it high contrast.


Jeez has it been a year since that comment already? Time flies.


Gotta love the “alligator energy” that kept approximately 10 lines of CSS from being added in the months since that comment. This isn’t rocket science


Firefox for iOS has a dark mode built in, it's how I always read HN on my phone these days. The only downside is it can make some websites look very strange as it will invert a lot of the colours, but for HN it works really well


Last time this got asked about one year ago dang said they were willing to do it.[1] Several people offered to help — so much that I found reasonable to expect the feature to get shipped quickly. No idea what happened.

1: https://news.ycombinator.com/item?id=23197966


I can recommend Hack if you're on iOS, I think the developer is pretty active here.

https://apps.apple.com/us/app/hack-for-hacker-news-yc/id1464...


Thanks for the recommendation. Most of the comments here suggesting Chrome Extension or tamper monkey scripts, but I can’t use them on my iOS phone.

To the HN mods, dark mode is an accessibility feature. Please consider adding it


> dark mode is an accessibility feature

The current interface has all kinds of accessibility problems, including insufficient color contrast, calling dark mode an accessibility feature isn't likely to be persuasive.

While I'm sure dark modes are helpful to some people with their disabilities, I think the expectation for accessibility should be sites robust enough to be usable when user agents automatically change colors to meet the user's needs.


Developer here. It's also available on MacOS and I also added post/comment reply notifications yesterday to the app. Let me know if anyone has any feedback.


Agreed! When reading late at night (in the bedroom, for example), it’s jarring to switch from a site that has proper dark mode to HN. I can understand some of the pushback, because at the start ”dark mode” felt mostly like a fad, but in low ambient light conditions, it really makes reading much easier and thus brings quite a bit of value. Of course it takes a bit of work to do it well, but that’s the case for all UX, and we don’t just ignore UX because ”ugh… work”



I would recommend Dark Reader for Firefox - https://addons.mozilla.org/en-US/firefox/addon/darkreader/


I use in on Firefox mobile, it's great.

It's also easy to configure to get a totally black background on HN for an OLED screen.


Extensions are not the answer, they lack dignity. I want it vanilla. I also want the dark mode to carry over into any browser I'm using on mobile.


>Extensions are not the answer, they lack dignity

It's amazing the kind of opinions you'll chance upon on the interwebs...


It was kind of a joke.


I want you to give me all your money. I also want it in bitcoin. As soon as possible.


"This is not an extension of honor."


If you're on android I recommend Kiwi, if you're on iOS I recommend android.


What is it with you people and dark modes? I can't look at light-on-dark for longer than a few seconds before my eyes start hurting, no matter whether it's in bed or during the day.


This is very different for people. I have some issues with my sight causing pages that are mostly white to be painful to look at. Over time, it triggers migraines. But I know people with the opposite issue. So as an accessibility feature, websites should offer both modes.


For HN, this really could be as simple as:

html { background-color: #fff; filter: invert(1); } body > center > table > tbody > tr:first-of-type { filter: invert(1); }

Yeah, you could make micro adjustments, but that adds almost zero bloat...


Thought: What about a box on the user settings page in which a user can specify their own custom CSS? It would only apply when logged-in.

That means those who want dark mode can get dark mode, and those who want whatever other zany random style changes they want can get that too. (Yeah you can use an extension, but an extension isn't very friendly if you use different browsers on different devices–e.g I use Chrome on my Mac and Safari on my iPhone.)

Wikipedia has something like that:

https://en.wikipedia.org/wiki/Special:MyPage/common.css


I, for one, welcome my new MySpace styled HN...

Seriously though, this could be a nicely elegant solution, especially if there was "suggested CSS to do X is, paste it below" or something.


The Anarki forums have a similar feature, except choosing from a list of installed themes.


Use tampermonkey and be happy.


There's a Chrome flag to force dark mode for all websites, it does a decent job at inverting colors. I recently started using it, no plugin/extension required.


For chrome you have a flag chrome://flags/#enable-force-dark It makes thinks dark but for my tastes the contrast is too high so I combine it with DarkReader to smooth it out more. This flag is not perfect, QR codes are for example not readable anymore by any scanner.

https://chrome.google.com/webstore/detail/dark-reader/eimadp...

solo it works also great in FF https://addons.mozilla.org/en-US/firefox/addon/darkreader/

When you open a new tab you may still get a white flash to prevent this you can use https://chrome.google.com/webstore/detail/whiteslash-white-b...


Dark mode is a "gateway feature" to more useless stuff.


It's gated behind a CSS "prefers-color-scheme" media query, so it will not affect people like you in any way, who haven't opted-in to dark mode in your operating system.

Some people suffer from things like eye strain and this would improve the accessibility of the website.


How is dark mode less useful than being able to change the color of the top bar (which is already a feature)?


Dark mode is an accessibility feature.


No it isn't, what evidence do you have to support that?



These all appear to be studies on the effectiveness of dark mode on legibility.

Where are the studies about dark mode being a "gateway" to "useless stuff?"


“dark characters on light background lead to better legibility and are strongly recommended independent of observer’s age.”

“the typically higher luminance of positive polarity displays leads to an improved perception of detail.”

"in users with normal vision, light mode leads to better performance most of the time."

So why go for dark mode if legibility, detail perception and performance is lower?

EDIT: please note that "dark characters on light background" is the contrary of dark mode; in dark mode there are light characters on dark background.


>So why go for dark mode if legibility, detail perception and performance is lower?

Ok you're arguing that dark mode itself is useless. I don't know enough about it to have an opinion on it one way or another, I can find sources on the web going either way.

What I'm asking for is the evidence for the slippery slope implied by "gateway" whereby Hacker News staff will be more likely to add further "useless" features simply by having added one. Assuming for the sake of argument that it is useless.


> Ok you're arguing that dark mode itself is useless

I didn't say it's useless; there are use cases where dark mode is useful, e.g. "people with cataract and related disorders may perform better with dark mode" (from the Nielsen study). But it doesn't make much sense to add a feature just because it is fashionable, and not because it has a true advantage. If the people in charge of HN decided to change their site, there would be far more useful features than dark mode. I think that was the OP was referring to with "gateway to more useless stuff": if fashion and not usefulness is the number one priority, then a good product could render useless and development resources are wasted.


On iOS I have accessibility functionality mapped to triple-clicking the lock button. I’m using a function called ‘smart invert’. I’m sure there’s something equivalent on Android.

How can you browse a site called ‘hacker news’ and have no ability to ‘hack’ your way out of a simple problem? /s haha


I have been using the Svelte clone of HN [0] when needing dark mode. It has a toggle for dark/light and is relatively quick to use.

[0] https://hn.svelte.dev/top/1



I know it's not a fix but I usually try to use dark mode for all the website in chrome by using chrome's experimental flag feature { https://www.xda-developers.com/google-chrome-android-dark-mo... }. However, this feature have some side effects like improper rendering but works fine for sites like HN.


I tried this out for a while but unfortunately there were a few too many websites where the text became illegible and for many websites it simply did nothing.


> I instinctively go on HN all the time even when I'm in bed.

You probably mean "habitually"; that's not what "instinctive" means.


in·stinc·tive·ly

/inzˈtiNG(k)tivlē,inˈstiNG(k)tivlē/

adverb

without conscious thought; by natural instinct.

I used it correctly, the idea is that I end up on HN without thought and the bright lights surprise me.

You should've pointed out 'built', I meant 'build'.


There is no "natural instinct" in human beings to use HN. Nothing that is classically conditioned is an instinctive behavior.


It’s a figure of speech.


Maybe it's hint from your body that you're consuming too much screen and in a non healthly way /s?


Not here to promote what I am building(Graha), but I wanted dark mode for hacker news for a very long time been using it like this for a couple of months

https://graha.io/edit/3njtAVYwagLy6bbtSu_vg


I use the Octal app on iOS. The developer is responsive.

https://apps.apple.com/us/app/octal-for-hacker-news/id130888...



I second this. Make it an option if there are any issues with it being a default.

My two gripes with the current HN styling are lack of dark mode and font size/text reflow. I have to constantly zoom and pan to read anything of consequence.


I personally prefer how HN looks currently, it's simple and super quick to load. I'm not a designer, but if anyone has suggestions on how to update the css then email: hn@ycombinator.com.

I'm sure one of the mods would take a look there.


Vivaldi mobile browser can force dark mode on websites, it looks similar to what Dark Reader extension does on desktop. Works well for HN, but breaks some websites and you can only enable it globally.


So does the Opera mobile browser, its dark mode works very well for me when I use it, on all sites.



I use Brave on Android and something has auto-darkmoded HN. It doesn't do this on PC but it's actually perfect.


At night on mobile, I switch to Samsungs browser which has built in Dark mode. I dont use it for anything else.


I just use an Android client for HN that has AMOLED Dark Mode. Very happy with it.


If you're on Android then Samsung Internet has a great dark mode.


Everyone is going to disagree about what dark HN should look like. (I already see someone asking for an OLED black variant.) Just use an app that provides a mobile-optimized presentation. And on desktop, use an extension like Dark Reader.


As a new father reading this at 02:49pdt, I second this idea.


Yes please!

Dimmed-dark mode for desktop and full-dark for OLED phones.


there are dark mode chrome browser plugins for this you could try


select all, it's kind of a blue mode ;)


I have no issue with Dark Mode, especially at night. I don't use it for my IDE/Editor, which sometimes earns me a sneer, but otherwise, it's great.

I really like the spartan construction of HN, though, and would be sad if it started to become a "Load 1MB of bootstrapped CSS and JS chrome manipulation software before you lose that 'X' in the address bar" site.


```

@media (prefers-color-scheme: dark) {

    * {

        color: #ccc;

        background: black;

    }
}

```

Really all you need for a rudimentary dark mode that automatically changes depending on your system preferences. Let's stop pretending this would take HN more than 30 minutes of dev time. Definitely would help improve accessibility.


This is just short of asking them to increase the font size... that's an exercise left to the user.

Your browser will let you do this via user styles, plugins, user scripts, etc ad nauseam. The OS might even let you do it.

On a normal website, that might be a bit much to ask, but this is hacker news. Even so much as googling the term "dark mode" will give you a plugin that does exactly what you want.


No, please don't. I hate dark modes and all the energy wasted on making them a feature.

Fix it with some CSS if it really bothers you.


Look at the source of https://perfectmotherfuckingwebsite.com/. It literally takes that little effort (3 lines) to add dark mode to a simple website. HN is a bit more complex but this is a tractable problem. Let’s not talk about “all the energy wasted” like we’re asking dang to solve the Travelling Salesman problem.


This is one of those kinds of things that looks simple, but turns into a land war in Asia by opening up endless bikeshedding and maintenance burden.


I tried the approach on my website - blog.nindalf.com. Seems to work alright.

    /* Assume light mode by default */
    @import 'light.css' screen;

    /* Supersede with dark mode when applicable */
    @import 'dark.css' screen and (prefers-color-scheme: dark);


If you care about wasted energy - each person fixing it own their own is more wasted energy than one developer building the feature into the website.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: