Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Ask HN: Dark mode for HN please?

news.ycombinator.com

Post reply on HN
Print view View original

131–140 of 469 posts

Re: Ask HN: Dark mode for HN please?

#132

Post by pjscott »

ochoseis wrote: post #109
jimmyswimmy wrote: post #56

Earlier quoted context omitted.

Please, for God's sake, don't screw it up. I can keep up with news on this site from a 15 kb/s shared satellite link when I'm out at sea. Except perhaps for the really big threads. I love the simple interface. It's text, it's simple, it's readable, and when I hit the spacebar, it scrolls down a page. No fancy fonts, no javascript, no nothing. I love HN for its simplicity and speed. Thanks for maintaining a good engin…

For the sake of simplicity, could we just serve up a subdomain darknews.ycombinator.com, same content, just different stylesheet?

When you click on a link to the news.ycombinator.com domain, what should happen if you prefer dark mode? And vice versa?

In comparison, the pure-CSS ideas that some people are posting would work automatically if your browser supports dark mode, and would enlarge the (cached with long ttl) CSS file only very slightly.

Re: Ask HN: Dark mode for HN please?

#133

Post by holler »

> I don't want my eyes to burn when I'm browsing HN at night on my phone.

I've looked at HN and many other sites on my phone at night for a very long time, and never once do my eyes burn. Why is this the expectation? Use Flux or a similar light dimmer on your phone/laptop, problem solved.

Re: Ask HN: Dark mode for HN please?

#134

Post by [deleted] »

jimmyswimmy wrote: post #56
dang wrote: post #32

Ok, you guys, this isn't the first time we've heard this request ( https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que... ). I'm willing to do it (edit: not to change the default! just to add the option). It's just that any CSS issue that goes more than a quarter-inch deep is outside both my expertise and my interest. We can add CSS to https://news.ycombinator.com/news.css for prefers-color-scheme: dark , bu…

Please, for God's sake, don't screw it up. I can keep up with news on this site from a 15 kb/s shared satellite link when I'm out at sea. Except perhaps for the really big threads. I love the simple interface. It's text, it's simple, it's readable, and when I hit the spacebar, it scrolls down a page. No fancy fonts, no javascript, no nothing. I love HN for its simplicity and speed. Thanks for maintaining a good engin…

[deleted]

Re: Ask HN: Dark mode for HN please?

#135

Post by the_pwner224 »

yjftsjthsd-h wrote: post #106
ryan-allen wrote: post #94

Earlier quoted context omitted.

You can stop assaulting your eyes by simply installing an extension: https://darkreader.org/ It takes 15 seconds and you will have solved your problem.

Yep, came here to suggest exactly this. Especially because then it works for all sites, not just HN. I can also second Dark Reader specifically; it's nicely tunable, supports per-site toggles, and lets you set a schedule to automatically toggle dark mode in the evening. I think my only complaint is that it might be the reason why my Firefox on Android gets really slow / hangs occasionally, although that might be unre…

It makes FF on my high-end desktop slow too, sometimes.

In the dark reader popup window you can set the Mode; the default of Dynamic does an excellent job of making everything dark but is pretty slow. The other modes have basically no performance impact but you might see some visual bugs from time to time.

Re: Ask HN: Dark mode for HN please?

#136

Post by kohtatsu »

ldd wrote: post #119
kohtatsu wrote: post #102

Earlier quoted context omitted.

Tested thoroughly on threads and the front-page, some notes: Upvote arrows blend with white instead of transparent, giving a weird look. The orange goes well with black. Not all users might want #000, but for OLEDs it's gorgeous. The @media selector requires a OS/Browser support, to extend that a simple way is programatically add a .dark class to (edit: based on a checkbox in their profile), and add selectors with .d…

Did you try my latest solution? https://pastebin.com/CKy4HQXE [I'm not parent] let me know what you think ;D

Cute! Just tried on threads and the frontpage.

I think #000 is the way to go for OLEDs, though I'm not 100% sure. I imagine it'd be nice to configure it. #cf looks cute too for text, I guess it's not super important to be closer to #fff? Maybe we just have good eyes tho w.

Having contrast on the textarea with a different colour is definitely nice.

Any reason you're selecting on .admin td and .admin? I didn't dig into the DOM too much; I just went down news.css going through each selector with a color:, then inspected elements to make sure none got through.

The only new additions, similar to yours, is , #hnmain, and textarea. input[type=text] could also be tackled, but I decided it was fine. Textarea is definitely a lot of bang for buck tho.

The .c5a, .c73, etc selectors are also important; those are for downvoted comments.

Re: Ask HN: Dark mode for HN please?

#137

Post by the_pwner224 »

_bxg1 wrote: post #63
falcolas wrote: post #51

Earlier quoted context omitted.

I have to say - if your monitor is blinding you, you have it set to too high a brightness. You're doing yourself a disservice by not turning it down. It should only throw out as much light as a piece of pristine printer paper in the same orientation. In the middle of the day my monitor tops out at about 30 of 100, and in the evenings I will occasionally turn it down to about 5 or 10. Many modern monitors will offer a…

I like having my display as bright as possible without it being uncomfortable; it helps with readability. On my laptop and phone I'll shift the brightness throughout the day to meet this heuristic, but alas, Windows does not make this trivial with an external monitor. Usually you have to fiddle with the monitor's physical buttons and navigate down into a menu. So I just don't bother.

https://twinkletray.com/

Most desktop monitors have their brightness & other config exposed via the DDC (DDC?) protocol. This is a simple UI that exposes the brightness controls on Windows. Much easier than using the buttons.

You might need to go to the monitor's menu and enable DDC if it's disabled by default.

On Linux this script works for me:

sudo modprobe i2c-dev; sudo ddcutil setvcp 10 $1 &

Re: Ask HN: Dark mode for HN please?

#138

Post by zhenchaoli »

dang wrote: post #32

Ok, you guys, this isn't the first time we've heard this request ( https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que... ). I'm willing to do it (edit: not to change the default! just to add the option). It's just that any CSS issue that goes more than a quarter-inch deep is outside both my expertise and my interest. We can add CSS to https://news.ycombinator.com/news.css for prefers-color-scheme: dark , bu…

My version looks like this: https://imgur.com/a/KCHi5mO

CSS:

@media (prefers-color-scheme: dark) { body { color:#cccccc; background-color: black } center>table { background-color: #222222;} td { color:#cccccc; } .admin td { color:white; } .subtext td { color:white; }

    a:link    { color:#cccccc; }
    a:visited { color:#eeeeee; }

    .default { color:#b2b2b2; }
    .admin   { color:#ffffff; }
    .title   { color:#b2b2b2; }
    .subtext { color:#b2b2b2; }
    .yclinks { color:#b2b2b2; }
    .pagetop { color:#dddddd; }
    .comhead { color:#b2b2b2; }


    .c00, .c00 a:link { color:#cccccc; }
    .c5a, .c5a a:link, .c5a a:visited { color:#aaaaaa; }
    .c73, .c73 a:link, .c73 a:visited { color:#838383; }
    .c82, .c82 a:link, .c82 a:visited { color:#727272; }
    .c88, .c88 a:link, .c88 a:visited { color:#777777; }
    .c9c, .c9c a:link, .c9c a:visited { color:#6c6c6c; }
    .cae, .cae a:link, .cae a:visited { color:#5e5e5e; }
    .cbe, .cbe a:link, .cbe a:visited { color:#4e4e4e; }
    .cce, .cce a:link, .cce a:visited { color:#3e3e3e; }
    .cdd, .cdd a:link, .cdd a:visited { color:#222222; }


    .pagetop a:visited { color:#cccccc;}
    .topsel a:link, .topsel a:visited { color:#222222; }

    .subtext a:link, .subtext a:visited { color:#727272; }

    .comhead a:link, .subtext a:visited { color:#727272; }

    .hnmore a:link, a:visited { color:#727272; }
}

    .hnmore a:link, a:visited { color:#727272; }
}

Re: Ask HN: Dark mode for HN please?

#139

Post by deleerium »

umvi wrote: post #126
deleerium wrote: post #100

Earlier quoted context omitted.

Screenshot: https://imgur.com/a/mxaNky4 Whipped this up real quick... keeps the spirit of HN I think, and is pretty minimal. Not my best CSS but tables/current CSS make some selectors a little tricky and after all, it's less than 1kb added, no markup or stack changes needed, and this is 'Hacker News' right? :D @media (prefers-color-scheme: dark) { body { background-color: #1F2430; } #hnmain { background-color: #23283…

Is there an easy way I can apply this using developer console so I can see what it looks like? I want to try out the different styles in the comments, but I'm hesitant to upvote until I see for myself what it looks like.

I just right clicked a few pages -> Save page as (static HTML/CSS/etc) then hack on the end of the news.css file. You can just append my css to that and you'll see exactly what I saw :)

Re: Ask HN: Dark mode for HN please?

#140

Post by splintercell »

holler wrote: post #133

> I don't want my eyes to burn when I'm browsing HN at night on my phone. I've looked at HN and many other sites on my phone at night for a very long time, and never once do my eyes burn. Why is this the expectation? Use Flux or a similar light dimmer on your phone/laptop, problem solved.

Also 'Hews' and other mobile apps have dark mode.
Post reply on HN