In dark mode, LaTeX gets inverted so it doesn’t appear as black text on a dark background (see PR #429). This works fine for me in the card preview mode, but in the main card view mode it doesn’t work. In fact, when you switch to dark mode, the LaTeX equations turn white for a split second, then revert to black.
Thank you to the developers who work on Anki and I wish you all a happy new year!
Are you sure you don’t have something in your note type styling, your card template, or the underlying HTML of your field that is causing this to happen?
If you’re not sure what to look for, you could post all 3 of those, each in their own preformatted-text/code-block. Someone will need those to reproduce what you’re seeing regardless.
It will also help to have your full version information. Go to Help > About – click Copy Debug Info – paste that here when you respond.
Thanks a lot for your quick response.
I should clarify that this is actual LaTeX (using [latex] [/latex], not the usual MathJAX. Does this bug not affect you?
I don’t think it could be caused by something that I have done because the preview view shows it correctly, while the normal card view does not. Furthermore, creating a new deck using the default settings has the same issue:
{{Front}}
{{FrontSide}}
<hr id=answer>
{{Back}}
.card {
font-family: arial;
font-size: 20px;
line-height: 1.5;
text-align: center;
color: black;
background-color: white;
}
Front and back HTML are both:
[latex]<br>\LaTeX<br>[/latex]
But this effect seems robust and unaffected by: Removing color and background-color from the CSS, trying LaTeX with other note types, different equations, changing from raster to SVG, etc.
Anki 25.07.5 (7172b2d2) (ao)
Python 3.13.5 Qt 6.9.1 PyQt 6.9.1
Platform: Linux-6.12.59-1.qubes.fc37.x86_64-x86_64-with-glibc2.36
===Add-ons (active)===
(add-on provided name [Add-on folder, installed at, version, is config changed])
AnkiConnect ['2055492159', 2025-11-09T19:40, 'None', '']
===IDs of active AnkiWeb add-ons===
2055492159
===Add-ons (inactive)===
(add-on provided name [Add-on folder, installed at, version, is config changed])
In my case, I do need LaTeX not MathJAX unless somebody knows ho to create nice commutative diagrams in MathJAX.
What are your exact steps to reproduce? I could not reproduce your “glitch” with latex on my debian linux (trixie).
Anki 25.09.2 (3890e12c) (ao)
Python 3.13.5 Qt 6.9.1 PyQt 6.9.1
Platform: Linux-6.12.41+deb13-amd64-x86_64-with-glibc2.41
(And, as always, try Troubleshooting - Anki Manual. E.g. you didn’t do #3)
Unless you are talking about switching the theme while anki is still open. If you do not restart after switching to dark mode, then the latex stays black instead of white. I do not see a flashing as you described, though.
Interestingly it seems that the following rule (turned off) creates the expected behavior of the text being white (but if you restart anki then that rule must be active):
.nightMode .latex {
filter: invert(100%);
}
No luck reproducing it too with a basic note type:
If you install AnkiWebView Inspector, you can inspect the rendered HTML in the reviewer and confirm if anything is overriding the CSS invert filter
So, for this one, here are the steps to reproduce:
[latex]<br>\LaTeX<br>[/latex].The latex color is black.
Turning off this css rule turns it white:
.nightMode .latex {
filter: invert(100%);
}
The color should be white in dark mode.
The latex now is white, as expected.
Turning off this css rule turns it black (which is undesired):
.nightMode .latex {
filter: invert(100%);
}
I don’t know what’s causing this, but I noticed similar behavior in other screens for a long time. Notice the button borders in the main screen for example:
I found something that doesn’t make any sense to me. If you inspect one of these buttons then they’ll claim to be computed as #252525. That makes sense keeping this in mind:
But the displayed color is the light theme one (#e4e4e4).
Manually setting border-color: #252525 !important doesn’t change anything, the color stays on the light theme color. But here’s what is very weird to me: If you click on the border color in the dev console and change the color picker values directly, you will see that it cycles between light and dark; even though it shouldn’t be.
Take this picture: #ffffff is rendered dark:
And so is #000000:
#fefefe is rendered light:
And gets progressively darker until it reaches #aaaaaa:
From here it just cycles again, even though the color should get darker.
None of these issues occur after restarting Anki after the theme change.
I think I found what’s causing this. The issue was apparently introduced in this PR:
The rationale was supporting CSS’s prefers-color-scheme feature.
If you go to the relevant Qt docs here, you’ll find a link to this Chrome article about so-called Auto Dark Theme: Auto Dark Theme | Blog | Chrome for Developers
The article suggests that prefer-color-scheme is separate from this Auto Dark Theme feature though. You can confirm that in Anki by adding something like this in your styling section:
@media (prefers-color-scheme: dark) {
body {
background: red !important;
}
}
@media (prefers-color-scheme: light) {
body {
background: blue !important;
}
}
You should notice that switching Anki’s theme from the preferences actually has no effect on prefers-color-scheme! I assume the setting is governed by operating system preferences instead.
Logged here:
I just now tried to turn on dark mode in Gnome and only then changing the theme in anki with the preferences: the colors for the buttons and the latex are accurate now.
Yep, this one too. If the dark theme has only been set by anki (but not in gnome), then the background is blue. If the dark theme is set by gnome (even if anki is set to light), then the background is red.
I opened a PR which should close the issue OP is seeing:
Interesstingly the PR mentioned above by abdo ([Qt 6.7] Set ForceDarkMode attribute in AnkiWebView by louwers · Pull Request #3622 · ankitects/anki · GitHub) had the goal to support prefers-color-scheme. But reverting this PR did not remove prefers-color-scheme at all (it still seems to work the same way).
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.