Chinese Fonts on iOS

AnkiMobile (iPhone/iPad) Help
1

I’m trying to style my cards for traditional Chinese characters so that they look more like handwriting / brush strokes and not the default robotic fonts. It looks great on my desktop, but reverts to the system font on my phone. I’ve tried several variations of the styling as below, but none seem to work on mobile. Is there some catch to fonts on iOS?

NB: This is a learning requirement, and not just fancy style. I’ve just come back from Taiwan, and while I was able to read official signs fairly easily, anything handwritten or styled was very difficult. Hence I’m trying to change my practice to reflect what I need in real life.

On the card:

<div class="zh" lang="zh-Hant">{{furigana:繁体字}}</div>

What I’ve tried in CSS:

.zh {
    font-family: "STKaitiTC-Regular", "STKaiti", "Kaiti TC", serif;
    font-size: 64pt;
}

.zh {
    font-family: "Kaiti TC", "STKaiti", serif;
    font-size: 64pt;
}

.zh {
    font-family: "STKaitiTC-Regular", "STKaiti", "Kaiti TC", serif !important;
    font-size: 64pt;
}

I’ve tried:

  • The sync is definitely working because changes to fonts and other card changes come across, but the font is still wrong.
  • Applying the styling directly to the div
  • Setting (or not) the language of the div)
  • Installing the Traditional Chinese handwriting keyboard and restarting the app

Is there no easy way to get fonts on iOS? I saw previous posts where people had just added the styling above and it worked.

Desktop:

image
image500×426 22.4 KB

iOS:

IMG_D64A2E6FEA51-1
IMG_D64A2E6FEA51-11179×835 73.1 KB

Thanks!

2
  • Are those fonts already installed on your iOS device?
  • If so, are you referring to them by the names iOS uses?
  • If not, have you attached them to your collection? Styling & HTML - Anki Manual
3

There is a “Kaiti TC” system font available for iOS, but it does not come pre-installed by default. To download and install it on your iPhone:
Settings > General > Fonts > More Fonts

1 Like
4

Thank you so much for this! I added the TW MOE’s font and used the instructions per the manual you linked, it worked like a charm.

I checked and I do have Kaiti TC and STKaiti installed, so not sure why it wasn’t working previously.

image
image1179×519 63.8 KB

1 Like