Custom fonts not working on iOS or Safari, but working on Chrome and Firefox (Desktop) - DAWN 15.2

[camelliaco]

I am designing a Shopify store for a client using the Dawn theme (15.2). I've installed some custom fonts to the assets folder and applied fontface rules to the base-css file. I have also added some element-specific tweaks in the custom css areas in the theme editor, and in specific files. Nothing is conflicting that I can tell. But, as the title says, the fonts do not work on iOS (both iPad and iPhone), or on Safari desktop. They DO work on Chrome desktop and Firefox desktop. What am I doing wrong?

The site is: https://vcavc8-f8.myshopify.com/
Password: okus

[camelliaco · Accepted solution]

Update - Solved!

After literal weeks of not being able to solve this issue and trying countless suggestions, I found the following that worked, from ricknoubal in another thread.

Some themes/browsers don't seem to like fonts that have been uploaded to the assets folder. Instead, upload fonts in formats WOFF2, WOFF & TTF directly to Files (in Dawn theme, thats Content > Files. This is actually easier because you can bulk upload the font files instead of doing individually. Then copy the full URL for each file into the below CSS:

/* CUSTOM CSS */

@font-face {

font-family: 'Your Custom Font';

font-weight: 300;

font-style: normal;

font-display: swap;

src: url('YourCustomFontFileURL') format('woff2'), url('YourCustomFontFileURL') format('woff'); url('YourCustomFontFileURL') format('ttf');}