I think the issue here is that the radical character is displayed as an image instead of text.
There are 3 possible ways how radicals can be displayed.
As image:
Via before pseudoclass:
Just text:
Most of them are either just text or use a before pseudoclass for the glyph.
I haven’t found a way to properly style image tags yet, at least not in a way that satisfies me.
According to standards, a pseudo-element with a combination of mask-image, attr, and a background-color (something like mask-image: url(attr(src url));) should work, but in practice… it doesn’t. attr is only supported in content at the moment, despite the spec saying it should be usable anywhere. 
Another idea is using filter with a color-transforming SVG filter like feBlend or feColorMatrix. I’m not sure whether browsers support applying SVG filters to non-SVG elements, but if they do, this might just work! It’s entirely CSS, too.
In the end, though, the easy way is of course to hard-code pseudo-elements for all the current image radicals. To be honest, that’ll probably work just fine, and won’t be at any real risk of breaking in the future. Any radicals added from now on will most likely be part of the custom font (although I suppose there’s a chaaaaance 
).
Yeah, I already experimented with filters, and I can kinda approximate the color.
There are a few issues with this approach.
First is that the image is completely white, so simple hue-rotate isn’t enough.
Applying a sepia effect helps, but the color is still a bit off.
Second issue is that the radical color can be configured with different colors.
So I would need to somehow calculate the correct color and apply the hue modification.
It’s a little bit too much work for just a few miscolored radicals.
Oh, so sepia does something? That’s weird, seeing as the images are white… You might be able to get closer if you put sepia, saturate, and hue-rotate on in that order. I’m fairly certain you’d need to write a script to pre-calculate everything, hahah. Possible, though!
In any case, I wasn’t talking about normal filters, but rather SVG filters (which can also be applied via the filter property). That might be even more complicated, though - I figured normal filters wouldn’t work, as I couldn’t figure out a way to introduce color into a white image. I’d love to hear how you did that!
It is indeed a bit much work for such a small detail. If you want perfection, though… 
Here’s an example in how this could be done just with CSS filters.
Note: filter order matters
In order to use SVG filters I would need to inject something via JS.
I’m limited to use CSS only for the userstyle though, so I guess this won’t be an option in this case.
Ah, brightness, huh. Cool. Try adding saturation before the hue rotate - might work.
You might not need JS to use SVG filters - check out filter: url(). If JS were allowed, though, there would be like 10 different solutions! Alas, the plight of the user style.
I’ll fiddle with it when I have a bit of time, thanks.
Downloaded it. Love it. I already had ‘WaniKani Grayish-Blueish-Dark’ Style and ended up with both styles checked, accidentally. It produced interesting results, which changed depending on which was selected first. I’m keeping both just because I love the results. xD Thanks! ~frankiebluej
Ah, I understand now. Thanks for the response.
I love this theme but I wish it was easier to differentiate between readings and meanings when doing reviews?? Or is there a way to change this myself
I just realized you can change color options on the userstyle page
I have a problem on chrome. It adds lines after I hover over something
I had the same problem. This fixed it for me.
Type chrome://flags/ into your address bar and hit enter. Then scroll down until you find GPU Rasterization and disable it.
Just out of curiosity, why do you prefer those off?
Thanks it worked.
Ok, so apparently the Stylish plugin will be broken with the coming Firefox 57.
If they do not update the plugin legacy extensions will cease to work, and therefore break the Stylish plugin.
I suggest using either the userscript version of the style (installable via userstyles.org, but probably no autoupdates), or an alternative plugin (Stylus for example) if they do not update the extension.
Can we get an update to make these banners more readable? The light grey text is really hard to read against the orange.
Especially on the new “More items became available” message.
Sure, I’ll get to it later.
Updated the style for the dashboard page.
I didn’t get the message on the reviews page yet.
Thanks for your work as always.
