[2026] WaniKani Dark Mode - by SGAIPG

WaniKani Dark Mode – by SGAIPG

(Download link)

If you find any bugs, weird text formatting, un-styled parts, etc, please feel free to reach out in the comments. ありがとうございます!


Update 28/02/2026: Updated styling for “Advanced” tab.

Update 17/01/2026: Added better compatibility with a couple of the more popular third-party userscripts. See list further down.

Have you ever wanted a clean, comfortable dark mode for WaniKani that still feels WaniKani?

Here it is! This lightweight userscript applies a dark theme across the entire WaniKani interface, done in a way that respects the original design language. Reducing eye strain during long study sessions, it uses subtle shades of grey rather than blacks and harsh contrasts, keeping the design clean and readable.

No settings, configurations, toggles, or sliders - a one-time install that works out of the box.
The script is functional across all WaniKani learning platform pages and is compatible with all themes (default, pastel, candy, retro, and neon), making sure you can still have your dashboard the way you like it.

You can install the script from Greasy Fork here.

How to install?
To install the userscript, you’ll need a browser plugin that can handle userscripts, such as Userscripts for Safari or Tampermonkey for Chrome.

  1. Install the browser plugin.

  2. Install the script from Greasy Fork (link above). It should automatically go into the correct directory for the plugin.

  3. For Tampermonkey on Chrome, make sure user scripts are enabled in settings, and enable “Developer Mode” in the Extensions section.

Should you not like the script, it is as safe and simple to uninstall as it is to install.

What about WaniKani on my phone?
Luckily, this dark mode script is easy to access on your phone as well! Here’s how:

iPhone / iOS:

  1. On iOS, install the Userscript app and follow setup instructions, including setting an app directory in the Files app (you may have to enable userscripts in the Safari settings as well)
  2. When the directory is created, transfer the script to your phone (using AirDrop or similar), and place it in the directory
  3. The script should now work in Safari

Android (untested):
For Android phones, Tampermonkey should be available for your phone browser, and the setup procedure should be similar. I haven’t personally tested this, but see no reason it shouldn’t work.

What does it look like? Well, take a look!
On desktop:

On phone:

I have suggestions! I found a thing that doesn’t work!
This is a spare-time project that evolved into a platform-wide dark mode script for WaniKani.
That being said, feel free to leave a comment about bugs, shortcomings, and/or suggestions.

Limitations

  • The script targets WaniKani’s official interface only, and is not active on community pages, forums, and similar
  • External scripts are not styled, unless specifically stated
    • Newest version should be compatible with the following scripts + settings menu:
      • WaniKani Ultimate Timeline 2
      • WaniKani Self-Study Quiz
      • Wanikani Dashboard Progress Plus 2
      • Show Total Lesson Count - WaniKani
      • Araigoshi’s Wanikani Stage Breakdown
      • WaniKani Keisei Phonetic-Semantic Composition
      • WaniKani Item Inspector

Disclaimer: This script is a spare-time project that is not affiliated with, endorsed by, or supported by WaniKani.

2 Likes

I tried the script. It doesn’t play nice with other userscripts.

1 Like

Hi @prouleau ! Appreciate the feedback - you’re correct, the script targets the official interface only, as third-party userscripts may use their own elements and styles that can be different between each script.

Seems like you have quite the bunch of third-party userscripts going on from that screenshot! Which userscripts are you running? I might add support for some of the more popular third-party scripts in the future, should there be demand for it :slight_smile:

1 Like

This is quite a limitation because most users are using some scripts.

I notice you don’t use wanikani css styling variables. Other dark styles uses these variables and leave to the scripts to use of these variables for supporting dark styles. You may check userstyles Breeze Dark 2 and Elementary Dark for examples of this technique.

Here is a list of the main scripts I use. Please don’t forget to style the settings panels.

  • Ultimate Timeline 2
  • Items Inspector
  • Dashboard Progress 2
  • Old School Item Stage Breakdown
  • Self-Study Quiz
  • Araigoshi Wanikani Stage Breakdown
  • Show Total Lesson Count - Wanikani
  • Keisei Semantic-Phonetic Composition
  • Niai Similar Kanji

Could certainly be the case - personally I don’t really use a lot of scripts except for a couple of mnemonic image plugins.

But yes, haven’t been too fond of using the styling variables. I’ll look into if I can have them be used as fallback for third-party scripts in a way that is still coherent with the overall design language.

I’ll take the list of scripts into consideration - appreciate the feedback

1 Like

I can’t get this user script to work in my browser (Edge). Any suggestions? I have tampermonkey and installed this user script but wanikani won’t go into dark mode.

Ok its working now, thank you!

I’m glad you got it working! Were there any additional steps or settings that you had to enable for Edge? If so, we may as well help other users using Edge by adding it to the guide above :slight_smile:

No additional steps beyond the ones suggested. Ended up just taking a little longer to start working than I expected. One piece of feedback I have is I notice on ‘light’ mode (i.e. regular wanikani), I’ve become very used to the lighter background of the ‘Vocab Meaning’ banner and the darker background of the ‘Vocab Reading’ banner to the point that my mind just automatically knows whether I need to be typing in the English or Japanese. The ‘dark’ mode does not make this distinction anymore and so I find myself slowing down and often typing the wrong input. Perhaps you could account for this somehow as I’m sure I’m not alone in my experience.

1 Like

Appreciate the feedback - I could definitely look into that, and I’m pretty sure that is possible. Will let you know if/when I find a solution.

@chimpchimpo21 Update - the newest version should make the distinction, although not as drastic as the original interface (it would otherwise become very bright for one of the categories). Try to see if it helps a bit, otherwise we can tweak it further :slight_smile:

1 Like

Pretty nice looking for me, a lot more pleasant than some of the other dark modes from ~2024.

WK added a lot of CSS in the widget update… too much to keep track.

1 Like

Glad to hear you like it! If there are widgets that look weird/unstyled after an update, feel free to post an image of it, and I’ll make sure to update the script :slight_smile:

Doesn’t play nice with lesson picker?

@kimochikun Appreciate the screenshot - the entire Advanced / Lesson Picker page should now work in the newest version of the script. Please let me know what you think! :slight_smile: