https://www.duolingo.com/elvper

A dark version of the Duolingo website

elvperPlus
  • 25
  • 22
  • 18
  • 15
  • 13
  • 13
  • 11
  • 2
  • 867

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

11 months ago

24 Comments


https://www.duolingo.com/JackRabbitEagan

Duo looks demented

11 months ago

https://www.duolingo.com/elvper
elvperPlus
  • 25
  • 22
  • 18
  • 15
  • 13
  • 13
  • 11
  • 2
  • 867

Halloween style owl :P

11 months ago

https://www.duolingo.com/S0R0USH
S0R0USH
  • 20
  • 17
  • 10
  • 9
  • 5

Doesn't being demented mean that it has dementia?

11 months ago

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.

11 months ago

https://www.duolingo.com/elvper
elvperPlus
  • 25
  • 22
  • 18
  • 15
  • 13
  • 13
  • 11
  • 2
  • 867

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.

11 months ago

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. ;)

11 months ago

https://www.duolingo.com/Captain_Duo
Captain_Duo
  • 11
  • 11
  • 9
  • 8
  • 7
  • 6
  • 5
  • 5
  • 5
  • 4
  • 3
  • 2
  • 2
  • 2
  • 2

super cool!!

11 months ago

https://www.duolingo.com/Usagiboy7
Usagiboy7
Mod
  • 25
  • 19
  • 18
  • 14
  • 7
  • 5
  • 5
  • 4
  • 4

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!

11 months ago

https://www.duolingo.com/elvper
elvperPlus
  • 25
  • 22
  • 18
  • 15
  • 13
  • 13
  • 11
  • 2
  • 867

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.

11 months ago

https://www.duolingo.com/Usagiboy7
Usagiboy7
Mod
  • 25
  • 19
  • 18
  • 14
  • 7
  • 5
  • 5
  • 4
  • 4

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

11 months ago

https://www.duolingo.com/Daniel745677

JackRabbit is right Duo looks creepy and demented!

11 months ago

https://www.duolingo.com/ThermopylaeHero

That looks kind of spooky

11 months ago

https://www.duolingo.com/ardanse742574

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

11 months ago

https://www.duolingo.com/elvper
elvperPlus
  • 25
  • 22
  • 18
  • 15
  • 13
  • 13
  • 11
  • 2
  • 867

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

11 months ago

https://www.duolingo.com/ardanse742574

lol!

11 months ago

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)

11 months ago

https://www.duolingo.com/Lili365542

ye it looks pretty cool but the owl creeps me out

11 months ago

https://www.duolingo.com/J1ng3rT41ls

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

11 months ago

https://www.duolingo.com/elvper
elvperPlus
  • 25
  • 22
  • 18
  • 15
  • 13
  • 13
  • 11
  • 2
  • 867

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.

11 months ago

https://www.duolingo.com/susanstory
susanstory
  • 24
  • 23
  • 13
  • 12
  • 10
  • 10
  • 10
  • 9
  • 9
  • 8
  • 8
  • 8
  • 7
  • 6
  • 5
  • 5
  • 4
  • 3
  • 3
  • 2
  • 2
  • 2
  • 2
  • 2
  • 1146

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.

11 months ago

https://www.duolingo.com/elvper
elvperPlus
  • 25
  • 22
  • 18
  • 15
  • 13
  • 13
  • 11
  • 2
  • 867

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.

11 months ago

https://www.duolingo.com/Ben400
Ben400
  • 15
  • 7
  • 6
  • 22

Scary!

11 months ago
Learn a language in just 5 minutes a day. For free.