What font is used for the Anki preview image in the Anki download page?

The Anki official download page seems to be using a preview image of Anki that is not using the default font.

Does someone know which font is being used?

2 Likes

The fonts depend on your system. If you’re talking about the image next to “Reviews”, the font here can be set via your card templates.

1 Like

In case you want to use the exact same font, you can easily retrieve it:

  1. Go to the anki website.
  2. Open the picture in a separate tab (e.g. https://apps.ankiweb.net/graphics/deck-graphic-light.svg).
  3. Open the dev console of your browser.
  4. Find the text element.
  5. Look for the font-family.

In this case you get

<text xmlns="http://www.w3.org/2000/svg" x="313.55115" y="191.79643" font-family="'STIX Two Math'" font-size="16px" text-align="end" text-anchor="end" style="line-height:1.25" xml:space="preserve"><tspan x="0" y="0"/></text>

which means the font is STIX Two Math.

1 Like

Unfortunately, it’s not that easy.

I wasn’t aware of the very welcome Anki’s homepage redesign, and like @anon_0000 did before me, I dug into the website SVG files to find information about the fonts they used.

However, it doesn’t appear to be any of the STIX Two families because, at least on my end, the font drawed in the images seems to be a Neo Grotesque sans-serif, and from what I can see, Scientific and Technical Information Exchange (STIX) fonts are all serifs.

EDIT: Added deck-graphic-dark.svg image as an example.

1 Like

You’re right actually.

If you look at the following picture you can see that the right side is the STIX Two Math font, whereas the left side is the one used in the svg. The font-family is actually unused because there is no <text> element in the svg.
anki

The fonts have been embedded into the svg (so that <path> instead of <text> is being used) in fix: embed font to svgs · ankitects/anki-landing-page@6e290ee · GitHub.

But looking into the above commit, it seems that the font they used is the Outfit Google Font.

1 Like

Thanks a lot everyone, it does appear to be the “outfit” font.

You beat me at it!

I was planning to focus today on finding the exact typography because I ended up liking it after looking at it and wanted to satisfy my curiosity and, of course, try to help OP. I was even going to send a DM to landingpageguage and ask for the source if I wasn’t successful.

Tyvm, @anon_0000!

1 Like