Auto Resize Font to Fit Screen

Anki Desktop
#1

Is there an add-on or maybe a way in Anki for it to automatically resize the font to fit the screen?

#2

“automatically” → idk

but you can change fonts on the template of the card (Anki: Customizing Card Style (font, color, hints, etc) - YouTube)

Using add-ons such as Set Font Size - AnkiWeb or Custom Styles (font color, background colour, classes) - AnkiWeb

might wanna check out: Changing the font - Frequently Asked Questions

1 Like
#3

You can make the font size responsive with pure CSS. Here, the fon’t size has a minimum, a maximum, and a calculation for the values in between, which is dependent on the smallest side of your viewport:

.card {
  /* clamp(MIN, VAL, MAX) */
  font-size: clamp(0.5rem, 1rem + 1vmin, 2rem);
}

If you swap out that vmin vor vw, it will only respond to the width of the window.

The clamp() CSS function clamps a value between an upper and lower bound.

2 Likes
#4

I have no understanding of coding. So how do I put that into my program?

#5

From the Anki note editor (e.g. Add-dialog), open the card template editor (button “Cards…” top left), head into the “Styling” section and replace the defined font size for the class .card with the one from my post above:

image

font-size: clamp(0.5rem, 1rem + 1vmin, 2rem);

You can play around with the values until you’re satisfied.
(rem is a relative length unit, where 0.5rem means half of the default font size and 2rem means twice the default font size of the HTML document. You can also use px of course.)