Google Fonts on Webflow: the GDPR risk you need to fix

TL;DR

Google Fonts loaded via the Google API automatically transmit each visitor's IP address to Google's servers, without prior consent. The IP address is personal data under the GDPR, making this transfer a non-compliant data processing operation. In January 2022, the Munich Regional Court ruled that a website using externally loaded Google Fonts violated the GDPR. The fix is to self-host fonts in Webflow by uploading them as custom fonts, which eliminates all requests to Google's servers.

Why do Google Fonts create a GDPR compliance issue?

The Google Fonts API works simply: when a browser loads a page that uses a font hosted by Google, it sends an HTTP request to Google's servers (fonts.googleapis.com). This request automatically includes the visitor's IP address.

Google states that it collects these IP addresses and uses them for analytics purposes. The Court of Justice of the European Union confirmed in the Breyer ruling (Case C-582/14) that IP addresses constitute personal data. The GDPR therefore requires a legal basis for this processing.

Legitimate interest cannot be invoked here, because self-hosting fonts is a simple technical alternative that avoids any data transfer. The Munich court confirmed this in January 2022: the website operator could have hosted the fonts locally and avoided additional data processing.

What the case law says

In January 2022, the Landgericht Munich ruled that a website using Google Fonts via the Google API violated the GDPR. The court found that transmitting the visitor's IP address to Google without prior consent constituted a violation of the right to informational self-determination. The site was ordered to pay 100 euros in damages, but the legal precedent is significant.

Since this ruling, thousands of cease-and-desist letters (Abmahnungen) have been sent in Germany to website owners using externally loaded Google Fonts. Other data protection authorities in Europe, notably in Austria, have taken similar positions.

In France, the CNIL has not published a specific decision on Google Fonts to date. However, its doctrine on data transfers to third-party servers without consent is consistent with the Munich court's position. A website that transmits IP addresses to Google without a legal basis faces the same risk.

Does a cookie banner cover Google Fonts?

No, a cookie banner does not resolve the Google Fonts issue when fonts are loaded via the Google API. Google Fonts do not set cookies, but they trigger a transfer of personal data (the IP address) as soon as the page loads.

This transfer occurs before any user interaction with the consent banner. Technically, requests to fonts.googleapis.com fire at page render time, simultaneously with the banner display. The user has not yet had time to give or refuse consent.

Even if you blocked Google Font loading before consent (which is technically complex in Webflow), this would create a display issue: the page would first render with fallback fonts, then shift after consent. Self-hosting remains the only clean solution. For more on compliant banners, see our GDPR cookie banner guide.

How to detect if your Webflow site loads Google Fonts externally

The most reliable method is to inspect network requests in the browser. Here is the process using Chrome.

Step 1: open developer tools

Navigate to your published site, right-click, then select "Inspect". Go to the "Network" tab.

Step 2: filter requests

Reload the page, then filter by "fonts.googleapis.com" or "fonts.gstatic.com". If requests appear, your site loads fonts from Google's servers.

Step 3: check the source code

You can also view the page source (Ctrl+U) and search for "webfont.js" or "fonts.googleapis.com". The presence of these references confirms external loading. Webflow states in its own documentation that the Google Fonts integration uses the Google Fonts API and may not be GDPR-compliant. You can also use the FlowConsent scanner for a complete audit of your site.

How to self-host Google Fonts in Webflow

Self-hosting eliminates all requests to Google's servers. Font files are stored on Webflow's servers, and no data is transmitted to a third party.

Step 1: download the fonts

Go to Google Fonts (fonts.google.com), select your font, and download the files. Prefer WOFF2 format for optimal loading. You can also use Google Webfonts Helper, which generates the files and corresponding CSS directly.

Step 2: upload fonts in Webflow

In Webflow, go to Site Settings, then the Fonts tab. Under "Custom Fonts", click "Upload". Upload your WOFF or WOFF2 files, and name each variant clearly (for example "Inter Local", "Inter Local Bold").

Step 3: replace fonts in the Designer

Open the Webflow Designer, identify every CSS class that uses the Google Font, and replace it with the uploaded custom version. Check all breakpoints: some fonts may only be used at mobile or tablet sizes.

Step 4: remove the Google Fonts connection

Go back to Site Settings, Fonts tab, "Google Fonts" section. Delete each Google Font you added. Publish the site, then verify again with developer tools that no requests go to Google's servers.

Common pitfall: Webflow's default fonts

Webflow includes some Google Fonts by default in its Designer (Lato, Varela, Open Sans, etc.). If your site uses one of these fonts, it may continue loading from Google even after deletion from settings. The fix: upload the same font as a custom font and replace all instances in the Designer. For a complete guide on cookie and consent management on Webflow, see our dedicated article.

Common mistakes (and how to avoid them)

Thinking the issue is only about cookies. Google Fonts do not set cookies, but they transmit the IP address. The issue falls under personal data transfer rules, not the ePrivacy Directive on trackers.

Removing the font from settings without replacing CSS classes. If you delete a Google Font without replacing the classes that use it, Webflow will apply a fallback font. Identify and replace all instances before deleting.

Forgetting fonts loaded via custom code embeds. Some templates or third-party components inject Google Fonts via link tags in custom code. Check Head Code and Body Code in site and page settings.

Ignoring fonts from embedded third-party services. A chat widget, a third-party form, or an embed can themselves load Google Fonts. The audit should not be limited to your own Webflow settings.

Not testing after publishing. Always test on the published site, not in the Designer. The Webflow Designer and the published site can behave differently when loading external resources.

Checklist: fix Google Fonts on Webflow

1. Open browser developer tools on your published site and check for requests to fonts.googleapis.com or fonts.gstatic.com.
2. Identify all Google Fonts used in the Webflow Designer (inspect source code, search for webfont.js).
3. Download the corresponding font files in WOFF2 format from Google Fonts or Google Webfonts Helper.
4. Upload the fonts as custom fonts in Site Settings, Fonts tab.
5. Replace every instance of the Google Font with the custom version in the Designer, across all breakpoints.
6. Check custom code (Head Code, Body Code, page-level) to remove any link to fonts.googleapis.com.
7. Delete Google Fonts in Site Settings, Google Fonts section.
8. Publish the site and test again with developer tools.
9. Verify that embedded third-party services (chat, forms, widgets) do not load Google Fonts themselves.
10. Document the fix in your GDPR compliance records.

FAQ

Do Google Fonts set cookies on visitors' browsers?

No, Google Fonts do not set cookies. The issue is different: each request to Google's servers transmits the visitor's IP address, which is personal data under the GDPR. This transfer happens without consent and without user notification.

My Webflow site uses Google Fonts. Am I at risk of a GDPR fine?

The risk exists. In January 2022, the Munich court ordered damages for this exact issue. In Germany, thousands of cease-and-desist letters followed. In France, the CNIL has not yet issued a specific ruling, but its doctrine is consistent with this case law. The fix (self-hosting) takes less than an hour.

Does self-hosting fonts slow down my Webflow site?

No, it is often the opposite. Self-hosting eliminates a DNS request to Google's servers and reduces the number of third-party domains loaded. The WOFF2 format is optimized for the web. In most cases, performance is identical or slightly better.

Does Webflow host Google Fonts locally by default?

No. When you add a font via Webflow's Google Fonts integration (Site Settings, Fonts tab, Google Fonts section), Webflow uses the Google Fonts API. Webflow states this in its documentation: this method transmits IP addresses to Google's servers. Only fonts uploaded as Custom Fonts are hosted locally.

Does the ePrivacy Directive apply to Google Fonts?

The ePrivacy Directive (and Article 82 of France's Informatique et Libertés law) specifically covers read and write operations on the user's device (cookies, trackers). Google Fonts do not place trackers on the device but trigger a personal data transfer. The issue therefore falls directly under the GDPR (Articles 6 and 44), not the ePrivacy Directive alone.

Do Font Awesome and other external libraries raise the same issue?

Yes, the same reasoning applies to any resource loaded from a third-party server that collects the visitor's IP address. Font Awesome, third-party JavaScript CDNs, external stylesheets: each request to a third-party server transmits the IP address. Self-hosting is the recommended solution for each of these resources.

Conclusion

Using Google Fonts via the Google API on a Webflow site is a GDPR compliance gap that most agencies overlook. The fix is simple, fast, and often improves site performance. If you want to identify all trackers and data transfers on your site, including external fonts, run a free scan with FlowConsent.