Text on back of cards won't invert in dark mode

Hi. I recently updated my anki to the new update and noticed that the back of my cards don’t show any text. I was messing around and realized the “issue” was because I was using the black theme. If I change the theme to light, the answer shows. I realized that when I use the black theme, the text on the back doesn’t change to white, it remains black, matching the background color. I looked through the forums and found possible solutions, but nothing seems to work. I’ve tried messing with the CSS with no avail.

The original CSS style is

.card {
  font-family: arial;
  font-size: 20px;
  text-align: center;
  color: black;
  background-color: white;
}

I’ve tried switching color to white and background-color to black, but that doesn’t seem to work.

I’ve tried adding nightmode with the below code with no luck.

.card.night_mode {
  font-family: arial;
  font-size: 20px;
  text-align: center;
  color: white;
  background-color: black;
}

I’ve attached screenshots of the resulting cards, no matter the changes I made to the CSS. Any help would be appreciated.

Here’s the recommendations for what to try – Removed Features .

Do I delete the current CSS and copy and paste everything? It still doesnt seem to be working.

No, I don’t think so. You just need to add a class that will automatically convert when you have night mode on. [Or I wonder if you could add it to your primary class if you’re an all-the-time night mode user like me?]

I still haven’t found any of my templates impacted by this – and I’m definitely not a CSS expert. But the first thing I would try is adding another section after .card ends – something like –

.card.night_mode {
	filter: invert(100%);
}

or maybe just –

.night_mode {
	filter: invert(100%);
}
2 Likes

The invert kinda worked, kind of didn’t. It’s okay. As much as I love dark mode, I think I’ll just bite the bullet and just use light mode. Thanks for trying though. I appreciate it