Testing a Dark Forum Theme

@iftekhs I have a task to switch the reply modal over to the dark theme, but I want to see what everyone thinks before I spend any more time tweaking things.

@JeffreyWay when I have liked a reply, the like button background color is white(ish); otherwise, background-color is dark-theme consistent

@tykus Fixed

@kokoshneta This is a tricky one, because far more people say that light themes are terribly hard on their eyes.

@JeffreyWay , well different organisms can react differently to the same stimulus.

My eyes usually have a very hard time when I need to read for long periods of time with dark schemes. With this proposed dark scheme, as it is right now, it is specially painful due to the high contrast, as other peers already noted. And it is clear you are using this week to gather feedback and do any needed improvements.

I know the majority of people state otherwise. In both SaaS products I built and my wife runs, we offer both a light and a dark mode after many user requests. And yes, it is painful to maintain both styles, I totally agree with this. Every new feature is a hassle to get right on both styles, for example when integrating third-party code, such as file uploaders, or when adding new charts. Even if a third-party component offers a dark stylesheet, you need to review it to see if it matches the overall implementation, and usually some tweaks are needed.

After implementing it, about 6 months ago -- and heavily communicating it due to so many user requests, -- on a userbase of around 700 users, around 70% of them tried the dark mode at least once after we released it, and about 15% kept using it, the others reverted to use the light mode.

Of course my wife's audience is way smaller than yours, my dark mode implementation might not be as pleasant design-wise, and the audience profile is very different, as both products are targeted to call-center internal teams, which is a very different audience than developers.

I have an somewhat funny anecdote on knowing to be the minority on this subject among developers. Some years ago, when I was working on a coworking space, a colleague that sat close to me once asked me why I went there every day and spent most of the day procrastinating and not doing any work. I asked him why he thought that, and he said every developer he knew spent the day looking to a black screen and I didn't. He was not a software developer, he was a designer, then I showed him one could choose different themes for their code and that it was a matter of preference.

I already found a solution to keep using the forums -- if you decide on keeping the dark theme -- by using a browser extension to invert the colors. It gets some stuff wrong, the content below the comment modal is invisible, but I can live with it. I would prefer the light theme back, but I have a feeling you will get a lot of support for the dark theme.

There is some research on the topic which conclude light themes increase readability on long and dense texts, increase cognition and also content retention. Results on eye health on short or long terms are not significant, although they tend to favor light themes by a slightly small margin, but not sufficient to be a health recommendation over user preference. If you are interested I can mail you links to some research papers on the subject.

Anyway, I just wanted to add my two cents, I am a big admirer of you as a teacher and as an entrepreneur. It is crystal clear all the dedication and effort you put on seeking to serve your users the best way. So, please don't get it as a rant by any means. And thank you for your hard work.

@rodrigo.pedra Thank you for the wonderfully detailed post, though. It is nice to see such involvement and your input is valuable to me. We're trying to push some small tweaks now, you should see them in a a little bit, they'll address the brightness of text and the cards here and a few others. See how you feel about it in a few hours maybe? Right now the decision has not been taken whether we keep the dark or light version.

@_adrian thanks answering, right now I am on the go, but when I get back to my office I will sure check it out.

Keep up the good work =)

@JeffreyWay My experience with people who say that light themes are too hard on the eyes is that they frequently look at screens in dark rooms – in which case, it absolutely is hard on the eyes. But looking at screens without sufficient ambient light is very hard on the eyes regardless of themes and should be avoided. When limited to well-lit situations, most prefer lighter themes in my experience. (But that’s just my experience, and entirely anecdotal.)

The lowered contrast has improved things somewhat. It’s no longer painful for me to read now, though still much more straining than the light theme. In the long run, I don’t think I’d be able to stomach it (or eye it, I suppose) either, and if it became permanent, I too would have to either find a plugin to reverse the colours like @Rodrigo, or stop participating altogether.

As a side note, I have also always thought the light theme was a bit too light and high-contrast. Avoiding too high contrast where there’s small text (especially longer sections of text, as often here) is essential on either end of the spectrum (light or dark).

I agree with whoever it was who said that the blue-greyish colours in the footer on the site are much more pleasant than these very dark, almost black backgrounds. If you were to switch the almost-black page background for something more like the footer dark-blue, and then switch the initial and hover-state background colours on posts (so the lighter one became the default and the darker the hover state), I think many eyes would find it much more tolerable.

@kokoshneta this is my impression too, people who strongly prefer dark themes usually work on darker environments, but that is just an impression, I know people who go full dark mode regardless of the environment.

@_adrian The changes make it much better, the drop in contrast is much welcome. Although my personal preference is still for a light theme, the reduction on text/background contrast stopped the eye harsh I was feeling compared to the older contrast.

I played with increasing the body text's font-weight a bit, but -- in my opinion -- it is best how it is currently.

Thanks for looking into it. And by the way, as others have noted, the dark scheme design is very beautiful. It is just not my personal preference for content I read for long periods of time.

@rodrigo.pedra No worries, we'll see what else we can do. If anyone has more valuable input I can improve this. But I am not considering the footer color as a background, though, that would be much too intense. Usually dark modes try to stick to shades of grey as I've noticed in many places, or even lighter shades of grey but I wanted to do something a bit more different and play with a blue tone - which is difficult to get right and of course not to everyone's preference.

For example, for me.. if I hold open tabs of both the light and darker versions and switch between (with a pause of a few seconds), it immediately hits me that the lighter version is more "attacking". I also wear glasses and have a bit of an eye issue and I usually have a backlight turned on at the back of my monitor to counteract the brightness of the monitor as well, so I'm trying to take all of this into consideration as well.

Another update now is that I made the hover state of posts brighter (when you move the cursor) so that it helps those that want even more brightness on a particular post, so that may help as well when reading to hover over if you still feel like it's too "dark" and the text is still swallowed up by the background.

@rodrigo.pedra Woah, well thought-out post! Could you reply with the links to the research papers?

@_adrian

But I am not considering the footer color as a background, though, that would be much too intense.

The reason I (and whoever else it was) suggested the footer colour is to make it less intense. The current background is very intense to me, more so even than the pure #fff white from the light theme (though I do think that’s too intense as well). When talking about the footer, I was referring to the right side of it, not the left – that would be too light and give too little contrast with the text.

Here is a screenshot where I’ve switched out the background almost-black #0f1725 for a slightly lighter colour, #182032, taken from the right side of the footer. It's not a massive difference, but even just that makes it a lot less straining for my eyes to look at.

Comparing to Firefox’s dark theme, even my lighter colour is actually darker than the grey background in new windows there, and the original black-blue is many, many shades darker.

(There's no gradient in the upper left corner in the screenshot, mostly 'cause I couldn't be bothered faffing with it to make it fit the lighter colour, but also because I'm not a fan of the gradient – it draws and distracts the eye, and even though it's the background of the root element, it visually looks like it's a filter on top of everything, including the text.)

Usually dark modes try to stick to shades of grey as I've noticed in many places, or even lighter shades of grey but I wanted to do something a bit more different and play with a blue tone - which is difficult to get right and of course not to everyone's preference.

The fact that there’s blue in it, not just grey, is one of the things I do like about this theme!

@_adrian

But I am not considering the footer color as a background

Why, it's much more pleasing. Not left bottom, but the area where support link is. The left bottom is not the same as right bottom. Left bottom is to bright and too much contrast.

Also area where support link is, the text (font) isn't as bright as left footer text.

Also what you have now is shouting at you. A reply with one sentence isn't too bad, but feast your eyes on a reply with several paragraphs, You may as well use a halogen light...

@circlePulse , thanks!

I can't share all I have as I have them in PDF and I would need to ask permission from the publishers, but here is two of them:

• https://www.tandfonline.com/doi/abs/10.1080/00140139.2013.790485
• https://tecfa.unige.ch/tecfa/maltt/cosys-2/textes/hall04.pdf

You can search for referenced articles on Google Scholar.

@rodrigo.pedra Well, I agree, that means we need light and dark theme :D

@kokoshneta @jlrdw Okay, cool. Valid points, I'll make the background lighter so as to not create this deep contrast between elements. I checked out your screenshot @kokoshneta and it looks good. Thought you guys meant the brighter color on the left. But in any case, I've included this in the next batch of updates and let's see how it goes =D

@_adrian no the bottom right footer where support link is.

@kokoshneta The forum now has a lighter background to help with the contrast.

@drehimself Should be fixed now. Thx.

I literally can't see the boxes that are on the right of this thread, the recommendations, the contrast is just wrong IMO.

Do you have the brightness turned down on your monitor? If you can't see the box background color on the right sidebar at all, there's a problem. It's perfectly clear on my screen.

@JeffreyWay My brightness is at max, however, I saw Tykus made some good points and elaborated on it better than I did ^^

But in general, I think the way the site turned out with the dark theme, isn't that great for the reasons other have mentioned - I think if certain issues are fixed, they will give a different response. So I wouldn't abandon the idea too quickly :D Just need tweaks.

@MohamedTammam I though the same, I wonder how much work that would be etc, and then it would still take time, he might tas well maintain that himself right so umm. Unless he appointed someone to make the decision for him.

@sr57 I can't go back to light theme anymore : p

My eyes will burn ;(

@MichalOravec I can understand your feelings. Plz don't take such a strong decision! You are one of the significant contributors to this forum in the last few years.

I know it's hard for @jeffreyway and his team to satisfy everyone in this forum, but I have a belief in him and his team to make this forum better day by day.

Let's keep our fingers crossed.

@tisuchi The main advantage here is that if we get constructive criticism we can all improve on it and can enjoy something few communities have. I guess yes, it's not always easy to nail it the first time but we're open to ideas any time. I am for sure so you guys can write anytime. Would like a feature? Don't be shy. Worst case scenario it ends up in my back log and we'll see about it sometime in the future.

@_adrian Thanks for your reply.

I totally agree with you. It's always hard to adjust to changes.

However, my personal opinion is still a big NO for the dark theme.

It's really hard for me to read.

@tisuchi The new update provides a lighter background color on top of the other changes so now it's easier to read.

@jlrdw Do you say that only for this site, or in general?

I find that other website dark mode are better than light, but laracast dark theme doesn't suit as well.

However, it doesn't look as bad now, but the contrast or the color combination.

This theme could be fine, but just something odd. But I see Jeffrey did some small changes now, I think its better now a bit - can you notice a difference today?

perhaps also lower the opacity for the user's avatar so it won't so harsh when all are in dark....

@tykus Thanks Tykus! your input was good and we already implemented some of these changes.

• The text is now at 90% opacity, which should help.
• The avatars are now at 90% intensity as well.
• The reply modal is only white now because this is a test, a design of the dark version already exists.
• The background color when hovered is now the default everywhere, and a newer brighter version of hover is implemented. Now the brighter hover may help those that still need a bit more contrast (hovering over the comment when reading)
• Have to see about the inline code, do you have a link/example?

@siangboon yep, that one's done.

Thanks @_adrian - those changes make the design more polished and readability is improved!

Avatars with transparent background don't look great (IMHO) on either the index or show views. My current avatar probably is okay with this approach, but take a look at this thread whose author has an avatar with a transparent background. This is probably a 1% problem... as most avatars do not have transparency.

@tykus hmm, yeah that is a valid point. Not sure what I can do about that other than try to force a background for those but people won't like that as I assume they want that transparency on purpose haha. But if you do have a suggestion or preference or you've seen a solution to this somewhere else, you can let me know and I'll sneak it in the next batch of changes ^^.

@Niush

Thanks for the tip, using the static filter setting the extension just inverts the colors without trying to make it dark, so it makes the forum kind of light mode for me... although with some funny colors. But at least I can get back to use it again.

Thanks a lot!

Hmmm... a downside is that when the comment box modal is open the content behind it is not visible... But I think I can live with two tabs open when I need to read a previous reply before submitting a new one.

@bugsysha Nono :( Just fix dark theme.

@aurelianspodarec I would agree with you if I was mainly using the forum during the night. But since that is almost never the case, it doesn't make sense to have a dark theme. There are a bunch of studies about which theme should be used and when. To sum it up since it is crystal clear, light during the day, dark during the night. So there you go.

I would suggest even using the dark theme during the night since a bunch of websites still don't have a dark theme and when you switch from dark to a light one, you can go blind.

So no-no for your nono.

@bugsysha Yeah, I do agree with you partially on that. I mainly this this at night tbh xd

But also depends on the theme, some themes are better dark, some themes don't work during the day - I think its somewhere in the middle, not necessary black/white, not saying you say that but yeah.

I think it varies, but for laracast sadly the dark theme isn't just quite there :(

@aurelianspodarec shame that @jeffreyway is refusing to have both themes.

@bugsysha I think the recent changes seem better though.

We'll, I don't mind paying extra for dark theme xd

@aurelianspodarec if it is about paying, then please downgrade me to a light theme :D

@bugsysha Nono xd light theme = free. Dark theme = 5£ per year, if we reah X users to funf it, I think thst'll be fair right xd

@tisuchi And those who use dark color for other website?

No discrimination please :(

😛

@aurelianspodarec Thanks for your comment.

... who use light color for other websites. I mentioned clearly who used light color.

I just provided my opinion as @jeffreyway asked.

It's from my personal UI experience...

My honest personal opinion...

Wondering why you use such a strong word discrimination?

Does my comment somehow reflect discrimination?

@tisuchi Pretty sure he's joking :)

@tisuchi I like to keep politics out from this, so if you re-read it without thinking about politics, and see "😛" I think that'll make more sense : d

Or just cultural differences.

Just take it lightly, what I wrote - were not talking about politics here : p

@JeffreyWay why not the blue background where the support link is below, it is much more pleasant to the eye.

@jlrdw The more proeminent blues are too strong, the main idea is to leave focus around the text and have the "cards" more like a faint outline in the background.

@Raymond Badoux The reply modal is still white because we're still testing the dark theme, but a dark design of it is already finished and waiting.

@_adrian Sweet - sounds great!

@johnDoe220 I don't know what you mean. How have they been abandoned?

@johnDoe220 No plans to do that.

@johnDoe220 Having no box gives more breathing space. Been trying to get rid of them for a while now xD

@_adrian Because we have training boxes on the right

In the middle of the page is a question and answer box

And this balance on the left is completely lost Most of all, the design is quite tasteful and you have probably come to this conclusion based on the data so far. As for breathing space, I must add that you are potentially right

@johnDoe220 I think it look nicer than in panel box.....

@johnDoe220 I don't like it - you're putting on them background but that doesn't need attention while being in single-thread.

@aurelianspodarec you are probably young. Wait till you get older.

@bugsysha Older people tell me that they have one pair of eyes and to put a dark theme on xd

I don't think age matters - there are probably many other factors included such as your DPI, monitor brightness, etc... that can make a big difference on how a theme works.

I use flux for example, so I don't get the sharp blue light going on my eyes.

Now I'm also going to buy some glasses that someone recommended to me and say they work - https://www.amazon.co.uk/COOLOO-Blocking-Headache-Computer-Accessories%EF%BC%8CUnisex/dp/B085SVZ6K7/ref=sr_1_7?crid=2EMLX4PAR1M4T&keywords=blue%2Bblockers&qid=1653065399&sprefix=blue%2Bblockers%2Caps%2C137&sr=8-7&th=1

So the only thing if eyes get strained, but my eyes get strained on white theme, not a dark theme - and I sit with lights on, unlike other people with lights off.

I don't think its black and white.

Monitor brightness and other stuff can affect how one sees this. Same with eye sensitivity, especially for those who sit all day.

I could not sit on the computer all day if I didn't had flux and dark themes on - my eyes would water, now its better and that's the only thing I changed, now I can finally sit on the computer without my eyes hurting that much - they only reason they might hurt now is if I overstay and sleep 6hours.

@aurelianspodarec as I've mentioned before, search for those studies. It is better to read it than for me to butcher what they were trying to say.

@bugsysha What studies are you talking about?

I've done my research on this many times, since I had issues with my eyes. So I don't know what you're referring to.

@aurelianspodarec the internet is full of it. Not sure what were you researching but you've managed to miss it.

The first argument for dark mode that's worth taking a look at the claim that dark mode is better for your eyes. While there is no doubt that using light mode in a dark room can be blinding, there also seems to be evidence that our brains are just better at reading and comprehending black text on a white screen.

For example, A 2013 study by Psychologist Dr. Cosima Piepenbrock looked at how adults with normal vision performed at visual acuity and proofreading text across dark and light color schemes. The study found that:

"Pupil sizes were smaller and proofreading performance was better with positive(Dark on Light) than with negative(Light on Dark) polarity displays"

In other words, for substantial digital tasks where you are attentively reading text(Such as coding), *having dark text on a light background (i.e. light mode) can help you focus and comprehend better. *

What this means in practice is that your eyes and brain may have to work harder to read and write code if your IDE is in dark mode.

I'm not an expert by no means, so listen to what more respected people in the community have to say on this:

• https://www.youtube.com/watch?v=rDMI1dpNfdw&t=353s

@bugsysha " evidence that our brains are just better at reading and comprehending black text on a white screen." - okay, but that doesn't mean its better than for the eyes or healthier. Debunked.

"proofreading performance" - we dont need to...

This is cherry picking but also it doesn't say its healthier for the eyes. You've just linked stdy that talks about focus, but we are talking about health.

Adobe did such studies too, its the reason why the tools are dark, because it lets the iser fous more.

The light background on code editor means my eyes will burn therefore reducing my focus.

Its not black and white.

And that is just research. Doesnt mean its ultimate truth.

It doesn't talk about eyes health, but focus - health is more important, but says who? Well, it is to me at least.

You can google why white theme is better but need to look at both sides.

There is a reason why billion dollar companies go for dark sidebars in products like photoshop etc... as well.

Its not black and white.

@bugsysha At the same time, not every dark theme is good either...

And different themes are better suited for different time of the day, and also depends what monitor you have.

During the day Id rather have white theme "just" on Laracast because its harder to see, but on other sites dark theme is fine.

Its subjective and there are plenty of variations.

You can go on google and say dark theme is better, and you will get research and studies back that up, and then you can go on google and say light theme is better and you will get research and studies back that up.

Therefore its not black and white, and the answer is somewhere there, in the middle.

Just like Trump didn't had good policies, but some of them were good. And just like Biden doesn't have good policies, but some of them are good...

Do I vote for Republicans or Democrats? The answer is I look at the policies - (and see what party/people do in fact do what they say they will do) in a simple way lol just an example.

I don't live in the US and don't vote for any but you get the idea lol

Just like big bang didn't happen... well, according to XYZ sources yes, but science works on probabilities for that.

There were other things that could have as likely happened but so so big bang had the highest probability to happen, doesn't mean its a fact... a fact maybe be if you're 6ft tall and you are.

Do masks work? Yes. No.

Against what... for what... to catch a ball? Probably yes. A basketball? Probably no.

Just all subjective.

Debunked. we dont need to

@aurelianspodarec really? Based on this answer I can only assume that you haven't watched the video. If you have and this is what you got to say, then sorry but I want to drop out of this conversation. Thanks.

@aurelianspodarec Exactly. Not to mention that most professional tools are default'ed to dark mode and most people work in those themes without ever changing them. I agree there are some who go for light but I honestly, even in the development world where I worked with lots of teams, have rarely seen a person use light mode in their tool environment.

@bugsysha I was replying based to what you copied and pasted there - I though you linked the video for reference.

@sr57 I think, worst case scenario, I feel like... based on Jeffrey point on not wanting to maintain this, since the theme is ready, why not create the switch, and not maintain the dark theme... and if it gets broken, then just delete it then.

Or open a funding page, I'll gladly donate £5 to keep the dark theme up since it's a big relief on my eyes and I use this quite a lot xd

@aurelianspodarec it isn't as bad on mobile, just desktop.

@jlrdw Some stuff is invisible for me on desktop xd still the contrast is bad.

In a way I feel like light theme could be better, this theme just doesn't feel quite right but I don't know. Recent changes were good, but still. Something is off with this theme IMO.