The short answer: raise the divider to 3–5px and give it a color, and the front and the back stay clearly separated even on long cards. Anki's default divider is a 1px pale grey line, so once a card runs past a few lines it disappears among the paragraphs. Thickening it alone turns it back into a clear "the answer starts here" signal.
Why the default divider stops working on long cards
The back of a card is usually the front's content ({{FrontSide}}) followed
by the answer underneath. For a one-line vocabulary card, a 1px line is plenty — your eye
takes in the whole screen at once.
The trouble starts with longer, prose-style cards. Put a two or three sentence question on the front and a few lines of explanation on the back, and the screen fills with stacked paragraphs. At that point a 1px grey line just reads as the gap between two paragraphs. You end up scrolling back to check where the question ended, and that re-reading costs a second or two per card — which adds up fast across a few hundred reviews.
The point is that a thick line cannot be mistaken for whitespace. Add color and your eye starts reading below the line automatically, right after the card flips.
How many pixels?
Match it to how long your cards run. In practice these values work well:
- 1–2px — vocabulary or term cards where both sides are a single line. Close to the default, and quiet.
- 3px — most cards, where one side runs two or three lines. The safest default.
- 4–6px — prose cards with a passage on the front or an explanation on the back. This is what actually separates multiple paragraphs.
- 7px and up — more of a color band than a line. It pulls your eye every time a card flips, so it's rarely worth it.
A thicker line also carries more weight, so pairing it with a line width of 60–80% tends to look better: bold, but not walling off the whole screen.
Setting it in ankieditor
- Select Back above the preview.
- Click the divider in the preview. If there isn't one, select the element right above the answer and click [➕ Divider] under Add Elements.
- In the left panel, raise Line thickness to 3–5px.
- Pick a color under Line color, just below it.
- If you like, bring Line width down to around 70%.
Everything updates in the preview as you go, so it helps to load field sample values roughly as long as your real cards before you start tuning.
The CSS this produces
ankieditor writes a rule like this into your template's styling section. If you'd rather paste it into Anki yourself, this code works as is.
#answer { border: none; height: 4px; background-color: #2e86de; width: 70%; }
border: none is the part you can't skip. The hr tag ships with
an inset 3D border in the browser's default styles, so if you set a color
without clearing that border, you get a washed-out double line with different shading top
and bottom. Clear the border first, then paint the element with height and
background-color, and the thickness and color come out exactly as specified.
Anki Desktop, AnkiDroid, and AnkiMobile all render cards in a webview, so this CSS behaves
the same everywhere.
Things to watch for
Night mode uses the same color. Anki's night mode does not invert colors
you set yourself. Pick a very light grey while working on a light background and it will be
nearly invisible on a dark one. If you switch between the two, a mid-tone
(say blue #2e86de or grey #888888) is the safe choice.
A line louder than the content backfires. The divider is there to guide reading, not to be a highlight. If your card already uses an accent color, keep the divider a notch quieter than it.
It's per note type. Templates are stored per note type, so you'll need to apply this to each one you use. You can turn that around, though: give each note type a different divider color and you'll also know at a glance which kind of card you're on.
Frequently asked questions
Does Anki allow changing the divider's color and thickness?
Yes. Anki renders cards in a webview, so ordinary CSS applies to the hr tag
exactly as it would on a web page. There is no restriction on Anki's side.
I raised the thickness and the line vanished.
If you set border: none without a background color, the element becomes a
transparent empty block and nothing shows. Thickness and color always have to be set
together — in ankieditor, touching either one records both.
Can I put a divider on the front too?
You can. That said, the front is best kept to just the question, so spacing usually serves you better than a line there.
If you're adding a divider for the first time, start with Add a Divider So the Answer Stands Out. And if your cards run too wide to read comfortably, setting a maximum card width pairs well with this.