DEV Community

Cover image for Dark Theme for Dev.to

Dark Theme for Dev.to

mercxry on January 24, 2019

Screenshots are at the bottom of the post Foreword This is a temporary solution until the official dark theme is released, for this rea...
Collapse
 
link2twenty profile image
Andrew Bone

We're working on making dev.to themeable, if you have to time please have a look at this issue and suggest some other variables that might be required.

[WIP] Theme-able CSS Variables #1377

I thought we ought to have a place where we keep a note of the current CSS Variables and also propose different variables that should be included.

Currently included:

Variable Description Default
--theme-background Background color of the main body #f9f9fa
--theme-top-bar-background Background color of the top bar #fdf9f3

Pull request pending:

Variable Description Default
--theme-top-bar-color Text and icon color for the top bar #0a0a0a
--theme-top-bar-search-background Background color of the search box in the top bar #e8e7e7
--theme-top-bar-search-color Text color for the search box, and its placeholder, in the top bar #0a0a0a

Proposed:

Variable Description Default
--theme-color Text color for the main body #0a0a0a
--theme-container-background Background color of the articles and nav-elements #ffffff
--theme-container-color Text color for the articles and nav-elements #0a0a0a

I think the best thing to do is leave a comment below of further proposals and I will update the main post.

Also feel free to do pull requests to help roll these out.

Thanks!

Collapse
 
mercxry profile image
mercxry

Surely 😉

Collapse
 
rhymes profile image
rhymes • Edited

Less invasive night reading
Helps you focus more on text
Prevents you from fatiguing your eyes for long periods in front of your computer

But is this all really true? I still haven't found definitive science that says so. Judging from my own experience I want to gouge my eyes out everytime I see a website that puts white text on a dark background, I couldn't definitely read a long article or a book in such fashion (if the kindle were white on black I wouldn't read much). Books after all have been black text on white background for centuries and people have turned out fine. It's also true that printing white text on a black background would be enormously more expensive. At the same time though I've had a dark theme in the code editor for ages, since I've started developing I guess and I've been fine with that too. I recently converted to a bright theme and to be totally honest... it's fine, it just took a little bit of brainpower to adjust.

So, is it really true that a dark theme is better for a human's health or is it just that we're all used to them so we think everything should be "dark themed" ? I reckon the dark theme idea in computing comes from the days of green text on a dark console and it evolved from there.

I wouldn't be surprised if in the end it would turn out to be just a matter of personal preference...

Collapse
 
mercxry profile image
mercxry

There are many opinions on the internet, if you search a little you can find sites and documents that say the opposite of what I said as "The Computer Journal 31(5):457-464" which dates back to the 80's where the screens were still cathode ray tube and 50% of the population was astigmatic, now we have better screens and according to statistics approximately 33% of people in America are astigmatic (since you are in Italy like me, the percentage is approximately 25%), so I would say that the situation has improved.

I don't find it valid that the fact that the books are written in black on white is valid because here we are talking about a dark theme for a website that you will read on a screen not on paper.

The kindle instead does an excellent job with its screen trying to emulate in any way the paper so you don't need to have a "dark theme" to get those benefits (although it offers the possibility to reverse the colors which is essentially a dark theme since there are 2 colors on the screen).

In conclusion I agree with you that it can be totally personal opinion, I did this theme because I prefer to have a dark theme instead of a light one, so I shared the theme, so those who prefer a dark theme do not have to wait for it to be officially released and can install it in a few clicks.

Collapse
 
rhymes profile image
rhymes

"The Computer Journal 31(5):457-464" which dates back to the 80's where the screens were still cathode ray tube

True, there's also that to consider, LCD screens are not the same as those in the 80s. It would be cool if someone were to invest in a serious study. In the meantime we have to remember to take brakes to avoid straining our eyes, regardless of which color the chosen theme is ;)

In conclusion I agree with you that it can be totally personal opinion, I did this theme because I prefer to have a dark theme instead of a light one, so I shared the theme, so those who prefer a dark theme do not have to wait for it to be officially released and can install it in a few clicks.

It wasn't intended as criticism, your post is valuable for those who want to activate a dark theme in the meantime. I just jumped on the opportunity to talk about this aspect (bright vs dark theme) that reappers from time to time.

Thank you!

Thread Thread
 
emgodev profile image
Michael

Light affects your internal clock, affecting your sleep. I believe it's blue/cold light that does this. Changing the color profile on your displays later in the evening to warmer colors helps reduce strain.

Collapse
 
vondelphia profile image
Webmaster • Edited

This is a temporary solution until the official dark theme is released

Continuously attempting to understand why, in 2024, there is no Dark / Light theme toggle option when logged out; instead, one must navigate to settings and manually save the preferences AFTER logging into DEV.

🤯

Collapse
 
kinghat profile image
kinghat

why not post this to github/gitlab so people can install it from source directly? i know it brings traffic to the style to post at userstyles but you can post to openusercss.org/ as well. better to get away from anything stylish.

Collapse
 
gugadev profile image
Gustavo Garsaky • Edited

Awesome! I've just installed it and really love it! Thanks :)

Collapse
 
codercatdev profile image
Alex Patterson

Oh my gosh thank you!!

Collapse
 
skarfrael profile image
Stelios Kotzastratis

Why use Stylus since Stylish now lets you opt out from url collection, analytics etc. ?

Collapse
 
mercxry profile image
mercxry

Personally I prefer not to trust more Stylish, then for the purposes of the post is much easier to install Stylus since you do not have to explain also how to opt out from data collection.

Collapse
 
kinghat profile image
kinghat

alt text

also, i think there is a transition style missing when posting a comment.