How can I use custom fonts in a Shop Mini?

Shop Minis
1

Hi everyone,

I’d like to use custom fonts instead of just system / default fonts, but I’m running into issues when building the app and can’t find clear docs on what’s supported.

I have my own font files (e.g. .woff2, .ttf) that I normally self-host in web projects. I’m used to adding them via @font-face in CSS and serving them from /public/fonts/... and that has been working for development. But then I tried to produce build via
npx shop-minis build
and got for ttf
Build failed: [restrict-imports-plugin] [plugin restrict-imports-plugin] assets/Oswald-Bold-CAX8aTdK.ttf has a blocked extension. Allowed extensions: cjs, css, gif, glb, gltf, ico, jpeg, jpg, js, json, jsx, mjs, mp4, obj, png, svg, ts, tsx, usdz, webm, webp.

and for woff2 as well
assets/WixMadeforDisplay-Regular-BMnt–X0.woff2 has a blocked extension

Then I tried to fetch from Google fonts and put the link into index.html’s head but I am getting

Refused to load ``https://fonts.googleapis.com/css2?family=Oswald:wght@700&family=Wix+Madefor+Display:wght@400&display=swap`` because it does not appear in the style-src directive of the Content Security Policy.

because CSP doesn’t allow loading styles from https://fonts.googleapis.com

whether I add that link into trusted_domains or not.

Questions:

  1. Are custom fonts actually supported in Shop Minis?

    • If yes, what’s the recommended way to include them?

    • If are not, what’s the recommended approach for having a branded, consistent typographic style in a Shop Mini?

  2. Are there any restrictions on font file types or loading methods?

  3. Does the Shop app impose any Content Security Policy (CSP) / sandbox restrictions that would block loading fonts from certain sources (e.g. external CDNs, data URLs, or even local bundled assets)?

If there are any official examples, documentation links, or a reference mini that demonstrates font usage, that would be super helpful.

Thanks!

2

Hey! Sorry we do not currently allow loading custom fonts. We will likely have a way to specify custom fonts in the future but for now we would encourage you to brand your app without relying on custom fonts.