San Fransisco Arabic Web Font for Windows

Question

I saw some people answered How to use Apple's new San Francisco font on a webpage

But the given solutions didn't work with Arabic. Even the answer that includes the font as a web font from an external library did not work with Arabic text (Tested on Windows 7).

This is how Arabic text looks like on OSX Sierra \ Firefox:

Very beautiful, and this is how it looks after trying to add the font from an external library on Windows 7 / Firefox (as given in this answer):

Looks like it is fallen down, so the default web browser font is being used.

I am trying to use the beautiful San Fransisco font in my website so it looks the same both on OSX and Windows.

Answer 1

The font linked in the CSS code from your link is pointing directly to Apple's version of the font, which is not compatible with Windows (for unknown reasons, but it has been speculated that there's something in the font spec that prevents it from working on other platforms).

You may have better luck manually downloading the fonts from here:

https://github.com/AppleDesignResources/SanFranciscoFont/issues/1

and then using a TTF font converter such as:

https://onlinefontconverter.com/

Then host the fonts yourself, and update the CSS accordingly.