[v2] Choosing color accents - tyuichis/modern-anki-card-template GitHub Wiki

You can change the accent color by editing the accent-{color} class on the main tag on the Front and Back sides of each Card template.

As of version 2, you now have two options for setting the accent color:

1. Static Accent Color

Use a specific color name (e.g., accent-blue, accent-red) to apply a fixed color scheme.

Available Colors:

• Red
• Orange
• Green
• Blue
• Pink
• Turquoise
• Purple
• Yellow

Example:

<section id="main" class="accent-blue">

2. "Smart" Accent Color (Recommended)

Use accent-smart to have the card automatically color-coded based on the Subject field. The card will load a _color-preset-{subject}.json file (from collection.media/) to load your color settings.

Example:

<section id="main" class="accent-smart">

If you had a file like _color-preset-languages.json, you can define colors for different subjects as follows:

{
  "vocabulary": "purple",
  "grammar": "purple",
  "pronunciation": "purple",

  "punctuation": "turquoise",
  "spelling rules": "turquoise",

  "dates": "pink",
  "numbers": "pink",
  "counting": "pink",
  "colors": "pink",
  "shapes": "pink",
  "sizes": "pink",
  "weather": "pink",

  "etymology": "blue",

  "idioms": "orange",
  "slang": "orange",

  "register": "green",
  "politeness levels": "green"
}

[!TIP] Use the AI prompt to generate color labels for your study deck, which can be found in the docs/ directory. This makes the process of generating and applying color coding faster and easier.

[!IMPORTANT] You don't necessarily need to follow the _color-preset-{subject}.json file name. You can use _color-preset-custom.json to add any "subject" : "color" key-value pair.