https://www.duolingo.com/elvper

A dark version of the Duolingo website

Preview:

In my opinion the best looking and most balanced dark version out there. It doesn't just flip black and white, but it changes the white into 50 shades of gray, which is a lot more gentle on your eyes. It might take a little bit of time to get used to, but I'm sure you'll love it!

It consists of two parts:

  1. A still relatively bright "Stylish" CSS script

  2. An optional Tampermonkey or Greasemonkey script which allows you to change the overall brightness, to enable everybody to set the brightness to their wishes. (it's nothing but a transparent overlay)

Complete installation instructions can be found here.

A comparison of the Stylish script alone versus the 2nd script set to 50% brightness:

I'll make it a bit more user friendly whenever I get a decent amount of spare time (not any time soon).

@Duolingo, feel free to base an official dark version on the looks of the script. I would like to also have a dark version on mobile! :P

November 12, 2017

24 Comments


https://www.duolingo.com/JackRabbitEagan

Duo looks demented

November 12, 2017

https://www.duolingo.com/elvper

Halloween style owl :P

November 12, 2017

https://www.duolingo.com/S0R0USH

Doesn't being demented mean that it has dementia?

November 13, 2017

https://www.duolingo.com/FrenchByte

It's pretty cool, thought I suggest a bit of color tweaking with the CSS. Then it would look more like those dark but not strange sites. And I think Duo should be designed a little differently. Also, the skills are still going to be gold, right?

I suggest we should be able to toggle between the two styles depending on mood. With some JavaScript or DOM, it wouldn't be that hard.

November 12, 2017

https://www.duolingo.com/elvper

To me it looks very good, but it's not perfect, especially the "daily goal" and "leaderboard" parts are a bit half baked..

If you're used to the "normal" version, a dark version like this is always going to look a bit strange. It takes a little getting used to. But once you do I think most will prefer this version over other dark versions.

The gold in my dark version I actually like the most.

November 12, 2017

https://www.duolingo.com/FrenchByte

It looks pretty good, but the gold looks more orange. The side-bar parts look a little strange, but other than that it's pretty good. ;)

November 12, 2017

https://www.duolingo.com/Captain_Duo

super cool!!

November 12, 2017

https://www.duolingo.com/Usagiboy7

These dark version scripts are so awesome. I finally got a thing that filters my computer's blue light to make it easier on my eyes. But, I've used a duo dark theme before and I loved it! I'm glad to see people are still making them for the updated versions of the website. Thanks!

November 13, 2017

https://www.duolingo.com/elvper

You're welcome.

f.lux?

The fun thing about your brain is that it will automatically "balance" colors. If you decrease blue light, over time your brain will get used to it, you won't even notice the difference compared to before as your brain adjusts to +/- see the original color. If you've gotten used to it, changing back will temporarily make the color seem odd / too bright. Thus it's an easy way to make watching a screen less bad for your eyes, to make you feel less tired and to be less likely to get something like a headache.

November 14, 2017

https://www.duolingo.com/Usagiboy7

f.lux is the one! I couldn't recall just then. (I could have hovered over, but, I didn't brain on that when I was typing earlier.) I am light sensitive. f.lux has been excellent. I keep the blue filtered all day, even thought it has a setting that can evolve with time of day.

Also, you're right. At first, I really noticed the orange/red tint. I still notice it, but, it doesn't bother me. It was a matter of adjusting and it's such a relief to my noggin. I've also installed Twilight on my Android phone. My phone on max dim is still too bright for me unless I'm outside in the summer. Twilight filters out the blue but also makes it possible to dim my phone even further.

Still, Duo dark themes are a whole next level of eye comfort from what I remember back when I was used one. I haven't installed it on my new computer out of laziness. :P

November 14, 2017

https://www.duolingo.com/Daniel745677

JackRabbit is right Duo looks creepy and demented!

November 12, 2017

https://www.duolingo.com/forest_breeze_17

That looks kind of spooky

November 12, 2017

https://www.duolingo.com/ardanse742574

I think it's kinda a spooky cool.:P It also kinda matches your profile picture.:)

November 12, 2017

https://www.duolingo.com/elvper

xD Thanks. Yes, that was the number one requirement! :P

November 12, 2017

https://www.duolingo.com/ardanse742574

lol!

November 12, 2017

https://www.duolingo.com/FrenchByte

I like what you added!

(I also think it would be cool if you could have one side 50% and the other 100%, but that seems ridiculous)

November 12, 2017

https://www.duolingo.com/Lili365542

ye it looks pretty cool but the owl creeps me out

November 13, 2017

https://www.duolingo.com/J1ng3rT41ls

Am I only able to change the color of my Duo on the Duo app?

November 12, 2017

https://www.duolingo.com/elvper

A dark version for the app is something Duolingo would have to create. It's technically possible to also create something for the app but it would pose few more challenges.

November 14, 2017

https://www.duolingo.com/susanstory

I use a Chrome browser extension called "Dark Reader" and it looks exactly the same as that, using this extension. The extensions allows you to set the contrast, brightness, sepia, dark, light, and grayscale.

November 12, 2017

https://www.duolingo.com/elvper

Several things look similar to it as both flip colors as primary adjustment. But the "Dark Reader" also makes some unwanted changes to colors. For example, displaying the negative of icons.

Comparison (Dark Reader on the left, my script on the right):

As you can see, the "base" operation is the same: swapping light with darker colors. But other than that mine is a lot more refined.

November 14, 2017

https://www.duolingo.com/Ben400

Scary!

November 20, 2017
Learn a language in just 5 minutes a day. For free.