It didn't take me long to disable GitHub dark mode. It is not made for quick reading. They should talk to the people who did dark mode for VS Code. After all it's all MS.
I really dislike the trend of pushing dark mode as a default on everything. There's at least some evidence that reading retention is higher with dark characters on a light background, and I think the preference for dark mode often comes from people sitting in badly lit environments, or having their monitor turned up to bright.
Blasting white light into your eyes from every pixel that isn't information is totally backwards and stupid. Light up that which represents something, not the background.
Can you imagine what life on Earth would be like if the cosmic background radiation was the brightest thing around?
Can your eyes tell any difference between diffuse and emitted light? If the background on your monitor is roughly the same brightness as the white painted wall behind it, what's the difference to your eyes?
Eye, Wikipedia: "Eyes detect light and convert it into electro-chemical impulses in neurons."
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.
> The less light your eyes receive, the less work they have to do.
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.
>...excess light at times of the day when the Sun don't shine messes up our evolutionary psycho-biology, causing issues with sleep.
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.
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.
VSCode dark is default. You can switch to light modes if you wish, but it starts out dark. At least in that app you have choices. Fortunately most modern editors and IDEs give you options.
Terminals and text editors have had dark themes as default for decades. This isn't a new trend. Spotify also has never had a light theme since launch (10+ years). Facebook (and 99% of other software released today) goes by whatever your browser/OS preference is.
Some ms windows docs turned dark recently, afair. Can’t remember which, but it often turns up when troubleshooting their fantastically clear 8001fcd8 etc error codes.
..and conversely I hate the trend of pushing black text on a white background. I have severe photosensitivity, and even in a brightly lit room with a monitor set to 75% brightness large patches of white background hurt my eyes to the point of building a migraine.
I've seen this more and more, but I wish sites would provide a way to switch themes. For example, the Ghost blog default theme follows your device preference, but AFAIK there's no way to toggle to light mode, which is quite annoying considering how common it is.
The unfortunate trend is people producing otherwise useful educational Youtube content (particularly developers) in dark mode. They surely don't realize they are losing some portion of their audience due to any of a few reasons (not the least of which is the audience who actually works outside sometimes!)
It's good for phones that have OLED/AMOLED screens, since it saves quite a lot of battery life. It's also good if reading in bed (with the lights off).
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.
It depends. I’m very light sensitive and can’t stop squinting even on cloudy day outside, but common light on dark makes my eyes get tired in minutes on any screen quality. Light scheme, night mode and brightness zero+ is what I’m using in bed.
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.
On iOS there’s an option to “reduce white point”. This way you can get reallly low brightness and low contrast on your phone. I’m using it often during night. I suggest to add a accessibility shortcut to the triple click home to toggle it
I'm okay with it as long as it's customizable. What I dislike is when apps or sites don't give you the choice.
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.
Let me switch instantly between light mode during the day, and dark mode at night, using one simple toggle, or following changes in browser settings. Then the issues with how dark or how light become nearly moot.
Hmmmmmm. Wonder why Github has bugs with the world's most popular browser, but doesn't have bugs with a (very similar) browser made by their owners ./s
(It's mostly a bug, or a setting in Chrome to not ask websites to use dark mode.)
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.
I’m curious if that article takes into account color calibration? Also, a sample size of 20 is relatively low to make a conclusion.
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 "math" is fine. I'm sure, while it's not perfect, it's suitable in most circumstances. My point remains though is that WCAG are guidelines, not mandates.
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.
The WCAG also define the contrast ratio in terms of sRGB, which is not a perceptually-uniform color space. This makes the WCAG contrast ratios somewhat meaningless in terms of human visual perception. It's accessibility by edict, not science.
There's a rather lengthy discussion of this on the WCAG issue tracker [1].
The issue creator also points out "It is a concern for me because this W3C document is considered authoritative, and has made its way into government regulations." Pretty interesting thread.
hah, awesome, I know exactly what issue this is without clicking through - Myndex is wrong on this, shockingly, but unfortunately my lips have to be sealed, for now.
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
Yes, WCAG are guidelines, but they are not just suggestions in a lot of cases.
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.
Hi, yes I edited the title of this HN post! It used to be "GitHub Dark Mode is too Dark. Here's the mathematical proof" but I understand how that can be misleading (and is inconsistent with the post title). Definitely my bad
Personally I love the Guthub dark mode settings. I really like the background to be near total black, and they got a nice balance from my perspective of what I find really enjoyable.
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.
I completely agree, and it’s one of my favorite dark modes ever. In my editors, I also use #000 backgrounds. I think this is the sort of “can’t please everyone” type situation which warrants even more options. If there are accessibility concerns, they should absolutely add a more accessible option with better contrast (and it should probably be the default if so - I really do wonder if it’s actually inaccessible). IIRC, more color options are on the roadmap? Perhaps I misremember.
FWIW, I'm red-green colour blind (quite badly), and often prefer more contrast to see colour delineations clearly - and I think GitHub's new dark mode is perfect.
I’m with you. I honestly don’t understand this vehement opposition. I guarantee you if something like the Dark Reader extension applied this same exact theme nobody would think twice about it.
I like dark mode on Github with the notable exception of the diff view, and unfortunately that's the thing I use in the web UI most often. In light mode additions are green and deletes are red - they're obviously different. In dark mode additions are dark greenish grey and deletes are dark reddish grey - they're really similar. That, for me, means I've lost a huge amount of information. It's bad enough to keep me in light mode.
Comparing to Twitter and StackOverflow, I had the same initial raction. For now I disabled dark mode on GH, hope it evolves into a less dark variation.
My bad for having a potentially misleading/clickbaity title that was inconsistent with the post title!!! It used to be "GitHub Dark Mode is too Dark. Here's the mathematical proof"
I love dark mode on websites and software, but after about two days of using it on Github I had to revert back to light mode. I was developing a headache trying to read their 14px gray text. There's also too many gray lines everywhere. It works with a white background with black lines, but with a dark background it feels really messy.
I agree, but from an entirely different point of view. Tell me I'm doing my eyes in if you will, but I find dark mode to be easy on the eyes, especially when - but not exclusively because - I can't always control how poorly lit my environment is. Dark mode, however, is also a curse, because when the contrast is too high I find that I get this "negative space effect" where in my vision the letters on screen go really dim and I get a series of fuzzy white lines appearing between the lines, making it almost impossible to read any text without immediately losing my place and skipping to the line of text above or below.
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.
Exactly. The idea that a web page should choose the font, font size, and colours is backwards. The user should be the one to choose these values. I want every page to use my favourite reading font in a size that is comfortable to me, in colours that I find easy to read. No web designer knows better than I when it comes to my own vision.
Thankfully Firefox has the "Allow pages to choose their own fonts, instead of your selections above" setting which you can uncheck so that Firefox always uses your preferred fonts. All pages can do is choose between serif, sans-serif, and monospace. And you can set a minimum font size, so that text is never too small no matter what the page does.
I hadn't realized that dark mode came out for Github, so I went and enabled it, and wow, even as a fan of "darker" dark modes (rather than the medium gray that so many apps and sites seem to prefer), I can see what OP meant! The main issue for me is that the text colors are all fairly dark as well; I'm sure that my tastes are too gaudy for most people, but I find higher contrast much easier to read, and on the off-chance that anyone else is like me and prefers much brighter text, I threw this CSS together:
```
.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:
Hi, newbie to programming/web in general here - how do I use this CSS to change the colours in GitHub? Is there a section within GitHub I can paste this in?
I don't know if github has an option for custom css but you can surely use a browser extension such as Stylus ([1], [2]) to change any website you want.
The brightness of the site should be under user-agent control somehow anyway.
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.
Counterpoint: preferences are subjective. How about an article about how github uses the wrong colors in their syntax highlighting? According to color theory, a method is blue, not purple.
206 comments
[ 2.9 ms ] story [ 230 ms ] threadThere's nothing wrong with designers who understand the concept still choosing to go for a 100% black.
Can you imagine what life on Earth would be like if the cosmic background radiation was the brightest thing around?
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.
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.
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.
We'd probably be dead. This also has nothing to do with dark mode.
https://spotify.design/article/reimagining-design-systems-at...
Genuinely interested to know where you have seen this.
I would be shocked if that's replicable.
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.
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.
(It's mostly a bug, or a setting in Chrome to not ask websites to use dark mode.)
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
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.
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.
There's a rather lengthy discussion of this on the WCAG issue tracker [1].
[1] https://github.com/w3c/wcag/issues/695
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
> While contrast ratios aren’t [everything](linked it here), they are a simple way to quantify the difference between two colors.
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.
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.]
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.
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.
But I want high contrast.
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.
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.
Everything else looked really nice though.
``` .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...
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.