Hey folks
Sorry for opening a thread if it already exists, maybe I overlooked it. But so far, I cannot seem to find Night Mode 
'Twould be grand if we had one for forums and/or even other sites, other than freecodecamp.com 
3 Likes
@SolarconSix I’m not sure if this is the answer to your question but on gitter go to the top right and click on your profile picture and you can pick a dark theme
2 Likes
Hi! As of now, we do not have a way to transition between day and not mode on the forum! Sorry about this !!
1 Like
I wonder (as in I might tinker with this at the weekend) how hard it would be to write a Chrome extension that changes the CSS to ‘night mode’?
1 Like
@sebshub I was thinking of this forum primarily, but thanks for the Gitter info though 
@michaelhenderson Ah… Sorry to hear that. 
1 Like
We’ve got a forum full of coders and this feels like a trivial JS and slightly less trivial CSS job…I think this is a solveable problem!
Free brownie points to whoever solves this first!
5 Likes
Here is the first hit on Google…
…someone feel free to do this before I do
2 Likes
I like dark mode/themes, too.
Question to poster and anyone else, after a little research on the subject: is your concern one of aesthetics or improving sleep (i.e. Night Shift mode)?
@icartusacrimea I tend to read and work a lot on the PC, so for me personally it’s just easier for me eyes. But if you mean staying up late into the night (or dawn) by ‘Night Shift mode’, then yeah, definitely improving sleep. xD
Edit: Why do you ask? What’s your preference? Is it aesthetics or Night Shift? Or something else… 
@kblock-dev Excuse my ignorance, I am still new to all of this… So how did you managed to achieve that (talking about your Dark forum theme screenshot)?
I agree with all of what you say. I find it more comfortable than harsh, bright white. Since becoming accustomed to a night shift schedule, I am beginning to feel the same about the sun as white screens, incidentally.
1 Like
I tried using stylish for this.
Failed.
You can do that easily with the developer tools. I use firebug for firefox…
Just set:
body { background-color: #000;} //or any color
But this will disappear when you refresh.
You could go beyond and create a greasemonkey script that will force the forum to have that color on certain times.
I’ll write a script which does that, just need a designer with a good eye for helping me with color pallete on the night theme. 
1 Like
Here you go, I did some changes in the css to change the forum to dark theme.
To make this changes permanent for your browser download this plugin called Stylish
Add this changes and save them, you have your dark theme now.
Feel free to edit it and share it back.
html {
background-color: #0a0a0a;
color: #d2d2d2;
}
.topic-map {
background: #272727;
}
#topic-title h1 a {
color: #c5c5c5;
}
.topic-map .buttons .btn {
color: #f3f2f2;
background: #272727;
}
aside.quote .title {
border-left: 5px solid #f0f0f0;
background-color: #272727;
color: #ffffff;
}
blockquote {
border-left: 5px solid #f0f0f0;
background-color: #272727;
clear: both;
}
a.mention,
a.mention-group {
color: #d2d2d2;
background: #272727;
}
3 Likes
I worked also on a greasemonkey script for the Night Mode theme.
// ==UserScript==
// @name FreeCodeCamp Forum Night mode
// @namespace forum.freecodecamp.com
// @description Adding night mode style to the FCC forum.
// @version 1
// @include https://forum.freecodecamp.com/*
// @include forum.freecodecamp.com/*
// @include *.freecodecamp.com/*
// @grant none
// ==/UserScript==
var css = "body {background-color: #333;}";
css += "#topic-title h1 a {color: #ddd;}";
css += ".cooked p {color:#fff;}";
css += ".topic-map, .topic-map .buttons .btn {background-color: #444; border-color: #555;}";
css += ".topic-map section {border-top-color: #555;}";
css += ".topic-map span, .topic-map h4, .topic-map .map .number, .topic-map .map i { color: #fff; }";
css += "nav.post-controls button.create{ color: #fff }";
css += "aside.quote .title, blockquote {background-color: #444; border-left-color: #444}";
var head = document.head || document.getElementsByTagName('head')[0],
style = document.createElement('style');
style.type = 'text/css';
if (style.styleSheet){
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
head.appendChild(style);
You can also edit it, it’s not yet perfect as styling goes… 
Download greasemoney from: Greasemonkey – Get this Extension for 🦊 Firefox (en-US) - firefox
1 Like
In Chrome developer tools, you can change the styling (css) for a page. All I did to get the screenshot was add a background color to the html tag and lighten the text a little.
1 Like
I tweaked @sagark’s
html {
background-color: #515151;
color: #f0f0f0;
}
.topic-map {
background: #272727;
color: #f0f0f0;
}
#topic-title h1 a {
color: #c5c5c5;
}
.topic-map .buttons .btn {
color: #f0f0f0;
background: #272727;
}
aside.quote .title {
border-left: 5px solid #f0f0f0;
background-color: #272727;
color: #ffffff;
}
blockquote {
border-left: 5px solid #f0f0f0;
background-color: #272727;
clear: both;
}
a.mention,
a.mention-group {
color: #d2d2d2;
background: #272727;
}
button.widget-button.reply.create {
color: #f0f0f0;
}
#suggested-topics a,
.badge-wrapper.bar span.badge-category {
color: #f0f0f0 !important;
}
a:visited {
color: goldenrod;
}
a {
color: goldenrod;
}
aside.onebox .onebox-body a[href] {
color: goldenrod;
}
aside.onebox .onebox-body a[href]:visited {
color: goldenrod;
}
.topic-list a.title {
color: #f0f0f0;
}
.topic-list .topic-list-item-separator td {
border-bottom: 1px solid darkred;
line-height: 0.1em;
padding: 0px;
text-align: center;
}
.topic-list .topic-list-item-separator td span {
background-color: #999;
color: darkred;
padding: 0px 8px;
font-size: 0.929em;
}
.nav-pills>li>a {
color: #f0f0f0;
}
pre code {
color: #f7f7f7;
background: #aaa;
}
Update
I tweaked it a little more to improve the font page.
Editing page still needs work.
2 Likes
Not sure if you are after something to reduce the stress on your eyes, like the iOS night screen mode. If you are, I just downloaded f.lux for my Mac that has a similar effect.
Just been trying different settings and it has a dark screen mode that is supposed to be for working in dark or poorly lit rooms. See below.
f.lux is great, it automatically changes the color temperature during sunrise and sunset.