Advanced Card Styles

AnkiWeb addon 1625103157

Enables customizing Anki card styles without CSS through profile selection, import/export, and a live-preview advanced editor, including text, cloze, extra field, image, and timer options.
AI-generated summary; may contain mistakes.

formatting appearance

Open on AnkiWeb GitHub Find alternatives

AnkiWeb

Votes: 26 (👍 22 · 👎 4)
Updated: 2021-12-28
Anki versions: 2.1.50~
License: AGPL-3.0 (from the license file in the package)
Virus scan: No ClamAV match A match does not prove malware. No match does not prove that the code is safe.
Languages: Python, JSON, CSS, Handlebars
Description language: en

Maintenance

stale

Last update or commit: 2025-01-16 (654 days before the snapshot).
Test files: 1.
GitHub Actions workflows: 3.
Commits in the last year: 0.
Issues: 6 open, 7 closed.
Pull requests: 0 open, 1 merged.
Median first response: 858 hours (8 answered issues and pull requests).

GitHub

Repository: ankipalace/advanced-card-styles · more by ankipalace
Stars: ⭐ 5 · forks 4 · open issues 6
Last commit: 2025-01-16
License: AGPL-3.0
Languages: Python, CSS
Tests: 1

Will it work on my Anki?

Version branches

Min Anki	Max Anki	Updated
2.1.0	2.1.25	2019-09-05
2.1.26	–	2021-09-19
2.1.28	2.1.49	2021-09-23
2.1.50	+	2021-12-28

History across monthly snapshots

Loading…

Similar addons

🟨 Sticky Notes for Anki - Create Beautiful Stickies in Anki Reviews

Adds customizable Markdown sticky notes to card review screens with live preview, images/GIFs, presets, templates, image/JSON export, and automatic grid layout.

export review-flow formatting shortcuts appearance

Export to Html 2025

Exports Anki decks to standalone HTML files with customizable templates and CSS, embedded images, Anki search filtering, and live preview before saving.

export formatting shortcuts fork-or-reupload

Kanji Keyword Overlay (anki 2.1)

Displays Heisig or custom kanji keywords in pop-up overlays on hover and color-codes kanji according to whether they have been seen or are unknown.

appearance card-templates dictionary

Templates Import / Export has 2 forks →

Imports and exports CSS and card templates for all note types via folders, with configurable delimiters, filenames, and optional global CSS handling.

import export formatting card-templates

Syntax Highlighting for Code has 2 forks →

Inserts syntax-highlighted code snippets into Anki notes, letting users choose the programming language via toolbar button or hotkey, with configurable line numbers, centering, and CSS styling.

card-creation formatting shortcuts fork-or-reupload

Export Anki cards as picture

Exports Anki cards as images using customizable Jinja2 HTML templates and CSS, with configurable resolution, auto-cropping, cloze replacement, excluded fields, and per-note/card-type templates.

export card-templates

Description

This add-on was updated using funds from the Anki Mastery Course. Please consider supporting our work using the links below so we can continue to fund add-on projects like this.

Gone are the days where the average layman had to know CSS! Introducing Advanced Card Styles and Editor.

This is a new addon that allows you to easily change the looks of your card and customize it the way you like. It also allows you to share card style with other users without having to manually copy and paste the text and/or having to import cards.

It has two main parts:

A - The card style chooser/importer/exporter B - The advanced card editor (with LIVE Preview)

Here is a quick look at what you can do:

A - To access the addon you just use the "Cards" button when editing the card:

Here you see the Card Profile Chooser: You can:

1- Open the Advanced editor (B) 2- Choose and Apply a profile from the ones you have already* 3- Save the current profile ** 4- Import a profile 5- Export a profile

When Applying a profile be sure to apply a [Cloze] profile only to a Cloze type card otherwise you might break it (All reversible by choosing a correct profile later). ** Saving the profile allows you to use it on other card types as well. Please SAVE YOUR CURRENT PROFILE before making changes as well to prevent any unreversible damages.

B - In the Advanced Card Styler (editor) there are 6 sections:

1- Card style section: this will affect all the card and all its fields. 2- General Text Style: this will affect all text in card including Cloze and extra section unless a specific style is used for them (section 3 and 4) 3- Cloze Text Style: Will set cloze text style and (overrides section 2) 4- Extra Field Style: Will set the style the Extra field (overrides section 2) 5- Image style: Will affect how imaged show and adds special effects if needed 6- Misc: Can add/remove a timer to the card, can also fix the Extra Field (Use in case changes in section 4 do not affect the Extra field of your card)

NB 1. Any changes made in the editor will be directly reflected in the card - Live preview. NB 2. When pressing the "..." button a color chooser will show up. NB 3. Any extra custom field style manually added to the CSS will be conserved but cannot be edited using the advanced editor. NB 4. The editor does not access your database in any way and thus is it a safer and totally reversible way of changing and sharing card styles.

Possible Issues v1.0 : Sometimes the addon does not work if you have nightmode installed.

Changelog v1.0 Initial Release. 19-09-21: Uploaded version for 2.1.28+, Fixed version for 2.1.26 22-09-21: Fixed incompatibility with Advanced Styles 28-12-2021: Updated to work with 2.1.50, including PyQt6

GitHub Link HERE. Please submit all issues to GitHub to allow easier follow up.

CREDITS AND LICENSE

Please consider checking out our: YouTube Channel- How to use Anki for beginners and advanced users. Instagram/Facebook: @Ankingmed www.TheAnKing.com- Recommended add-ons, tutorials and more including how to download 40+ add-ons in < 5min Patreon/VIP- Support our work and get individualized Anki help!