GitHub Dark Mode is too Dark
blog.karenying.com
blog.karenying.com
Does anyone else find this to be unnecessarily abrasive? It's a really harsh note to end the post on when describing a product that many people use for free. It seems to imply that Github has some sort of moral failing for their color choices and additionally that the author is entitled to command them to change their work.
Edit: I doubt the author intended it as such. The tone is just unfortunate.
Now I'm imagining Lady Gaga's "Fashion" in my head but the lyrics are about coding.
However, yes, that kind of language over a dark theme is ridiculous and not persuading.
This is not meant to criticize you, OP, personally. Rather, I just want to point out a structural double standard.
+1000 to the author for raising specific accessibility concerns and contrasting (no pun intended) the colour palates with those of other sites. The old “dark gray on light gray; tiny text” style (see: daring fireball of days past) drives me nuts.
I think the author makes fantastic points and it’s unfortunate that the somewhat mean spirited language distracts from those points, leading to this discussion rather than a more substantive one about accessibility. Not the end of the world either way.
Having said that, I think it's a safe bet to assume that one doesn't "only" find such tone policing comments when the author is a woman, because one almost always finds such tone-policing comments on hacker news whenever there's an opportunity to complain about tone.
It is not that HN doesn't already have a "baseline obsession" with tone or that male authors never fall victim to this. But rather, one can observe a trend where such tone-policing comments are more likely to occur and get upvoted if the author is a woman. And on the flip-side, comments commending a harsher, "more" honest or rant-y tone are more likely to occur when the post was written by a male author.
I don't know if it does or not but without evidence this is just conjecture from all sides.
Consider that you may yourself be sexist.
You present no evidence either. I think comments like yours actually want their accusation to be true because it gives you some sort of power and moral clout.
TFA is written like a tweet. It’s indeed obnoxious. It should be somewhat of a red flag that you felt the need to bring up gender. It’s also a lazy accusation. Though the accusation is very trendy these days.
Yes, GH is free, but being free does not mean they are above criticism.
EDIT: The contrast ratio of the author's website (background vs. main copy font color) is ca. 12.29, i.e. almost exactly that of GH dark mode (12.26) and which they claim is too low. So go figure.
I reread the article a few times and i dont see that at all. It isn't even ranting. She put out some criticism, with some evidence and possible theory. And "hope", Github could change its mind. I quote
This is still a beta feature so I have hope.
This isn't GitHub! Do Better! with double exclamation market. Simply a call to action for something ( hopefully ) better. The we deserve part is a figure of speech.
It's Microsoft running a for-profit project on a freemium model not an act of charity. Criticizing how sloppy the choice of color palette was and suggesting one of the most valuable companies in the world should be able to do better has only become the natural thing to do. Time and time again we've been shown the only way to enact the most minor and least controversial changes is to make a bunch of noise in blog posts and call out the behemoths for their shortcomings.
And hell, if we extrapolate from this (shitty) line of thinking, maybe Microsoft was saying "Haha plebs if you want a dark mode that functions better you should stop being poor and only buy OLED monitors."
Minor nitpick: The Web Content Accessibility Guidelines are precisely that - guidelines. You should follow them until you have a good reason not to. And contrast ratios arent everything.
This article https://www.bounteous.com/insights/2019/03/22/orange-you-acc... is a good example of how the "most accessible" colour pairing, by the "mathematical proof", is the least accessible and preferred by users.
There's a rather lengthy discussion of this on the WCAG issue tracker [1].
Look into the correspondence between the space Myndex uses, the space contrast ratio is measured in, and then again at the W3C docs: TL;DR Myndex's approach doesn't account for reflectance off the screen
WCAG has been adopted as the standard for a variety of regulatory purposes. For example, with Section 508/504, the US Access Board requires procurements to be compliant with WCAG 2.0 AA. Germany’s BIVT is harmonized with WCAG 2.1 AA, California requires state entities and procurements comply with WCAG 2.0 AA, etc.
At least in the US, the main sphere where WCAG has not been specified as the regulatory standard is with Title III places of public accommodation.
However, Federal Courts have repeatedly upheld that places of public accommodation must make their websites accessible, they just won’t say how to accomplish that (nor is it their job to).
In the case of GitHub, I can tell you with 100% certainty it has been provided to, at least, the Federal government as part of a procurement, is subject to Section 508 statutory requirements, and WCAG 2.0 AA is the required standard.
This is to say, it might not be a good idea to arbitrarily decide that color contrast sufficiency is just a suggestion.
The European Union requires its member states to comply with WCAG 2.1 AA on _all_ public websites. Every branch of government, every agency.
Anyways, I do think this is an important point: the math of contrast ratios is a model that’s intended to reflect what’s going on with people’s vision; if a large-scale study of people indicates that the white/orange button is easier to read, the math is just wrong: we have to be careful not to force reality into our models, otherwise the modes lose their utility.
The goal always to produce software that is accessable and usable by people, not to satisify a mathematical constraint. WCAG and 'constrast ratios' are a means to that end, but they're not the end goal itself.
Anyways, we’re not really disagreeing as far as I can tell.
It doesn't really matter because most displays aren't color-calibrated.
> While contrast ratios aren’t [everything](linked it here), they are a simple way to quantify the difference between two colors.
``` .link-gray-dark, .news li blockquote, .link-gray, .text-gray, .text-gray-light, .UnderlineNav-item, .blob-code-inner { color: white !important; }
/* code comments are a dark gray by default, so I made them something brighter */ .pl-c { color: orange !important; } ```
As a bonus, if you also can't stand the sidebar on the right of the main page, you can hide it and reclaim the space for more useful content with this:
``` [aria-label="Explore"] { display: none !important; } ```
[1] for Firefox: https://addons.mozilla.org/en-US/firefox/addon/styl-us/
[2] for Chromium based browsers: https://chrome.google.com/webstore/detail/stylus/clngdbkpkpe...
Except in the cases of saving battery on OLED displays or viewing a screen in very low ambient light environments, dark mode is the wrong answer to a problem of an overbright display.
If content on a screen seems too bright, the solution is the turn down the display brightness. This is a choice you can make as your circumstance dictates. Dark mode is a nice option for a few cases, but it should not be forced upon anyone.
There are two cases where dark mode is a really bad thing:
1. You're presenting your content via a projector in a room full of people (and a room full of people will have some ambient light, because safety rules generally prohibit trapping a lot of people in pitch darkness). No matter how many lumens the projector can put out, they will not make your low contrast content as visible as light mode would have been. Most often, the ambient light of the room will completely wash out the low contrast projected image.
2. You're making a screen recording of your content to demo or educate others (Youtube, etc.). The low contrast, colorful text will not compress as accurately as light mode, so the resulting text will be blurrier than if it were in light mode. So it will be harder to read compared to light mode content. Plus, if your viewer happens to be in a bright room or outside, your content will be unreadable. You've just wasted your good effort by limiting your audience.
Edited typos :(
The reasons we're seeing more of it are that developers are switching their bad hard-coded UIs to more flexible systems which allow it, and now that even MacOS/iOS supports it, there's an expectation for more and more apps to conform.
[1]: another valid case is apps with a strong emphasis on graphics: Photoshop, YouTube, Instagram, etc. A dark UI mitigates visual interference with the content.
Edit: but to be fair, I agree dark mode can be bad in some contexts like the examples you gave.
I very much prefer using light themes but I also record screencasts (400+ of them at this point).
Every time I run a poll asking folks if they prefer light or dark there's been a majority requesting dark mode in the recordings.
Personally I find the colorization of most dark themes having more contrast between the colors. A lot of light themes will make certain keywords dark colors which kind of looks the same on compressed video. I'm not sold on that being the reason most folks prefer dark themes, but I'm also not convinced light mode is better for video recorded content. I think with the right themes, maybe both are equal.
I've gone as far as writing a shell script to easily toggle dark and light mode for my terminal, tmux, Vim theme, FZF and other tools: https://nickjanetakis.com/blog/live-coding-a-shell-script-to...
All I end up doing is running `toggle-dark-mode` to seamlessly switch between the 2.
I know this because I have tried, with three different modern laptops (two MBPs and an XPS) which have the best brightness available for laptops. If I hit dark mode content, it just has to wait until I'm indoors. But usually I'm looking for something because I need it at that moment. If I can't view on potential illustrated video, I will try the next one I can view.
People taking the time to produce content often do care about attracting and keeping viewers/subscribers, and this is a case where an accessibility issue will reduce the number of viewers.
I highly appreciate the effort people put into sharing their knowledge, but I find it really disappointing when I can tell that their effort is wasted on some potential viewers. I may be weird (no, I am, but that's not necessarily a negative), but I know I'm not the only person with this opinion.
I have a $300 13" Chromebook with a 1080p IPS display and I spot check some of my videos on it. I'm able to read the text outside. Although I try to position myself to not directly have the sun glaring on the screen. That would be an issue to read anything, video or not.
I'm always for improving accessibility. If it's not too much trouble would you mind skimming one of my videos to see what it's like on your main device? Here's a video on creating a GPG key pair: https://www.youtube.com/watch?v=1vVIpIvboSg
Your video appears to be all in the terminal, and most text is white on dark background. Plus the font is bigger.
Contrast this (pun not intended) with an example of a colorful code video (not an ide, but representative of what you see in a lot coding videos https://youtu.be/zC7TcrRi46Q (not to pick on the producer of this video... just grabbed an example). This example is unreadable in bright ambient light, and there are many videos with about the same colors and fonts. These are the ones I'm talking about.
In the video you linked I see what you mean. I haven't tested it outside but just eyeballing some of the screenshots in the presentation the blue function names are likely impossible to read, the dark orange / red module names could be borderline too since it's kind of dark text on a dark background, and even the green atoms are a bit similar to the background in terms of darkness. I'm not sure what color theme that is but personally I wouldn't use it.
I try to stick with One and Gruvbox. Both have pretty decent contrast ratios for both light and dark variants. I have 1920x1080 screenshot side by side comparisons of both with dark vs light in my dotfiles at https://github.com/nickjj/dotfiles.
If it isn't, I usually just don't care or actually prefer white for some things like writing mails.
So I'm encouraging people to consider their audience. If there is no audience, then one has only oneself to consider :).
There are fundamental differences when designing for bright/day vs dim/night that benefits humans. In-car GPS was a specialised UI that paid attention to this earlier than our computers. The night UI maximised clarity in a low-light environment without being distracting. The day UI met the daylight with similar clarity. Never jarring.
Triggering a system-wide change across devices when the sun dips below the horizon is a nice start. The fact that it trickles even as far as webpage and VS Code theme is just awesome stuff.
Speaking to your detrimental cases, maybe the auto-change could be based on ambient light level rather than sunset time. It is certainly possible. Excluding the Nordics, the better solution is likely to move humans closer to natural light. Dim the room or build for natural light, rather than our screens able to be brighter to meet an artificial environment.
Both OLED and browsing in random low light environments often happen in the context of mobile devices. We do more and more on our phones. Because of that I wouldn’t treat OLED and low light as an edge case.
Kind of off topic, but I've always wondered why this is an issue. If I invert the colors, will those parts of the image suddenly compress just fine? Is it something to do with human perception of dark colors (like how many compression algorithms use more detail in various characteristics we're more sensitive to, such as brightness, as opposed to color)? That wouldn't make sense to me, as it seems to be a pretty obvious visual flaw.
I'm not sure, but I suspect that in general, dark mode syntax highlighted (highlit?) text is on average lower contrast than syntax highlighted light mode text. That could affect compression behaviors, perhaps.
Bold statement. I insist on dark mode everywhere and love it. Besides what compelling reason is there to give the user fewer UI knobs? We all have our own preferences.
And the points you mention are not a problem with dark mode but with low contrast. These can be fixed by increasing contrast.
What you're saying is akin to saying: "You like dark mode? Well you're wrong its bad for you." No thanks, not interested in your opinion.
If you are the only person viewing your screen, then by all means use whatever color scheme you like. I never said it was bad for you. I just illustrated when it is bad for some people.
Article: "While there is no mathematical proof [...]"
Can we stop with the clickbait titles?
You don't arrive at a mathematical proof just by saying the words mathematical proof.
I don't see that. Was it edited in the last ten minutes?
[EDIT: Oh, maybe you're paraphrasing. It does say "proof" but not "mathematical proof" near the title.]
On a desktop though I prefer to use blue-filters at night, and nothing during the day.
However for those sensitive to light I assume dark mode is a lifesaver.
On subj, I wish such sites to publish their colorscheme css that would be easy to modify and drop into stylebot (iirc that extension name). It’s often a couple of colors and a background that have to be adjusted besides defaults to look good enough. We’re all different.
https://spotify.design/article/reimagining-design-systems-at...
I would be shocked if that's replicable.
Genuinely interested to know where you have seen this.
I like my operating system UI/chrome to be dark, but my documents (including Web pages) to be dark on white. This is becoming increasingly difficult to do, although you can force Firefox into reporting light mode to every page if you have to.
Can you imagine what life on Earth would be like if the cosmic background radiation was the brightest thing around?
We'd probably be dead. This also has nothing to do with dark mode.
When your eyes detect light, they have to do work. Electricity and chemicals are expended and recycled to pass the information on to your brain. The less light your eyes receive, the less work they have to do.
Similarily, the screen blasting the light with LEDs consumes more energy the brighter the light is. White is literally the most expensive color to both produce and process.
Additionally, excess light at times of the day when the Sun don't shine messes up our evolutionary psycho-biology, causing issues with sleep.
So yes, light is literally bad for you, in this context. Natural sunlight is different because your skin needs it to produce essential vitamins.
That is folk wisdom in the IT field. At best, it is blue light, but there aren't enough long term studies to conclusively say this. BMJ Open Ophthalmology published a study in 2018 that said blue light could be a factor in eye tiredness, but it also stated dry eyes due to lack of blinking for long periods a more serious cause of eye strain. It also noted very small fonts, low contrast, and medical conditions like uncorrected astigmatism and presbyopia as factors.
https://www.ncbi.nlm.nih.gov/pmc/articles/PMC6020759/
Human eyes don't have good night vision, we see best in daylight.
Black text on a white background is best, since the color properties and light are best suited for the human eye. That’s because white reflects every wavelength in the color spectrum. Because of the reflection, our irises don’t need to open as wide to absorb the white light. That leaves our irises in a neutral position and allows us to see with better clarity. This is especially true when white light is contrasted against black, which absorbs wavelengths instead of reflecting them.
Light text on a dark background makes the eye work harder and open wider, since it needs to absorb more light. When this happens, the light letters can bleed into the dark background and cause halation, which makes the text blurry. Our eyes focus better when the iris is narrow.
Additionally, most people are born with some form of astigmatism, a misshaped cornea that blurs vision. For people that have the worst forms of astigmatism, light text on dark backgrounds aggravates the condition. When looking at a light display, the iris closes more, decreasing the effect of the deformed cornea. When using a dark display the iris opens to receive more light and the deformation of the cornea makes halation worse.
On the flip side, dark mode helps with floaters, tiny fibers or spots that appear in a person's vision. These are caused by changes to the fluid in the eye which cause shadows to be cast on the retina. Floaters distort vision in light mode. This condition tends to increase with age.
Also, people with light sensitivity might be better served by a dark background.
Both light and dark mode should be offered for accessibility reasons.
Or, the less light you receive, the more work they have to do focusing.
> LEDs consumes more energy the brighter the light is
The opposite is true of LCD screens. But that isn't relevant.
>excess light at times of the day when the Sun don't shine messes up our evolutionary psycho-biology
What about not enough light at times of the day when the sun should be shining? The light from any monitor is insignifcant compared to that from the sun anyway.
Lack of light is thought to be a cause of myopia, or in other words, light is literally good for you.
I love that they're doing it, but yeah, the colours aren't right yet. There's a lot of complaints here: https://github.community/c/github-help/dark-mode-beta/65
I say kudos to GitHub. I wonder how much they may have gleaned from telemetry with VSCode and user settings there. That’s a wealth of information for this type of decision.
The trend towards AMOLED dark mode has made life hard for me, especially when using websites or phones (looking at you, Android 10 and above) that I can't really customise the way I can the rest of my computer. Give me Gruvbox's #ebdbb2 on #282828 any day of the week, I want to get off the AMOLED #ffffff on #000000 train.
(It's mostly a bug, or a setting in Chrome to not ask websites to use dark mode.)
https://github.com/ScFix/DarkHacker
https://chrome.google.com/webstore/detail/dark-hacker-news/i...
Implementing prefers-color-scheme is the correct thing to do, and I daresay it wouldn't damage the admirable minimalism of the site to do so.
In reality, the best dark mode is when you hit the perfect balance between a dark and a light shade of gray that's clearly and easily readable but doesn't seem like you've focus lights pointing at you wherever there's text on a dark page.
Next week on HN: GitHub Light Mode is too Light.
Remember, you read it here first!
I have the opposite reaction. I wonder what kind of computer/monitor the author is using.
I found that lighter colors (whites/greys/very light pastels) display way better on an Apple-made monitor while darker colors look much better on Thinkpads/Acer/Asus/etc. monitors.
I got into quite a few back-and-forths with designers that only design on Macs because the colors look _way_ different on other devices.
There's nothing wrong with designers who understand the concept still choosing to go for a 100% black.
There are extensions (e.g. dark reader) that try to generically make websites dark using graphics filter and CSS tricks. This approach mostly works, but fails pretty badly in some cases. It'd be nice if this client side color adjustment were standardized and website makers testes their sites with it. This way, each person could make sites as dark as he wanted.
Read the blogpost
I was deceived! :P
But on a serious note, it took two seconds for me to turn back on light mode. No thank you, GitHub.
With that extension I can set the exact darkness, contrast and other knobs. Every site adheres to that. That’s exactly what I want from dark mode. Uniformity across the web.
If nobody else could do it then do it yourself.
Everything else looked really nice though.
Or... give us the option to set our own colours.
But I want high contrast.
Dark is dark. Personally, I’ll take any shade of dark over any shade of light.
The real question is... when will HN get dark mode? :)