Fonts in DevLink Export

DevLink Export includes every font your Webflow site uses. There are three kinds: Google, Adobe (Typekit), and custom uploaded fonts. Each ships a little differently.

For Google and Adobe fonts, <DevLinkProvider> injects the WebFont Loader and the Adobe kit script at runtime, using the same approach as a published Webflow site.

Google Fonts

No setup is required. Google serves Google Fonts without any domain restriction, so they render the same way on localhost, *.vercel.app, and your production domain.

If the Google Fonts script fails to load, DevLink logs a single console warning pointing at Content Security Policy as the most common cause. If your app enforces a strict CSP, allow:

• script-src https://ajax.googleapis.com
• style-src https://fonts.googleapis.com
• font-src https://fonts.gstatic.com

Adobe Fonts

Adobe Fonts enforces a domain allowlist per web project. Webflow automatically adds your *.webflow.io staging subdomain to the allowlist.

Register your deployment domains

When a browser requests your kit (https://use.typekit.net/<kitId>.js), Adobe checks the request’s origin against this allowlist. Unregistered origins get a 403 and fonts fall back to the next family in the CSS stack.

If the Adobe Fonts script fails to load, DevLink logs a single actionable console warning pointing at the allowlist and at CSP (script-src https://use.typekit.net, font-src https://use.typekit.net https://p.typekit.net). The warning fires only on actual failure, so correctly configured consumers see no noise.

Custom fonts

Fonts you uploaded in Site Settings → Fonts → Custom Fonts (any .woff, .woff2, .ttf, or .otf files) ship as pure CSS. The exporter writes an @font-face block for each weight and style variant into css/fonts.css, with src URLs pointing at Webflow’s CDN:

1
@font-face {
2
  font-family: 'Brand Sans';
3
  src: url('https://<webflow-cdn>/.../brand-sans.woff2') format('woff2');
4
  font-weight: 400;
5
  font-style: normal;
6
  font-display: swap;
7
}

No JavaScript runs for custom fonts, no scripts are injected, and <DevLinkProvider> is not involved. The browser loads them the same way it loads any other external CSS asset.

What you need to know:

• No allowlist or setup required. You uploaded the files, and they serve from Webflow’s CDN with permissive CORS.
• CSP: if your app enforces a Content Security Policy, allow Webflow’s CDN in font-src (and style-src if your CSS is inline). The exact hostname is visible in the @font-face src URL in your synced css/fonts.css.
• Cache: Webflow’s CDN sets long-lived cache headers. After you re-upload or delete a font in Webflow, run webflow devlink export to pick up the new URLs.

Troubleshooting