I’m developing a streamlit app and I want to use a custom font. I found some tutorials on how to do that using some css, and it works locally. I also deployed my app using Streamlit Cloud, and when I access the app from a browser in my laptop, the custom font renders correctly, while when I access the app from my mobile, the custom font does not render. I used Firefox both from laptop and mobile, and on the mobile I also tried Chrome, to no avail.

Below are pictures of the current situation:

from laptop:

from mobile:

I’m not an expert in using css, and I expect that the app should behave in the same way since the code is the same and I’m using the same browser.

The code is freely accessible in this repo. In particular, note:

• the css file;
• the app entrypoint, where I put the hack to read the css and use it to set the font for the whole app;
• the page I shared pictures of;
• I loaded the ttf file in the same folder where I put the css.