How to host Google Fonts locally, and why it matters under the GDPR

01 / Guides

Are Google Fonts GDPR compliant? What the Munich court decided

The fonts themselves are free to use. The question is how they are loaded. On 20 January 2022 the Regional Court of Munich (Landgericht München I, case 3 O 17493/20) ruled that a website which loads Google Fonts dynamically from Google's servers, and in doing so passes the visitor's IP address to Google without consent, infringes the visitor's general right of personality and right to informational self-determination. The court treated the IP address as personal data and saw no legitimate interest, because the same fonts can be used without any connection to Google. The site operator was ordered to stop and to pay the visitor 100 euros in damages.

In the months that followed, many website owners in Germany and Austria received letters demanding payment over Google Fonts, many of them legally doubtful. However you judge that wave, the technical fix is simple, free and usually makes the site faster. This guide covers the technology. It is not legal advice; if you have received a demand letter, talk to a lawyer.

02 / Guides

Does this matter outside Germany?

A judgment of a German regional court only decides the case in front of it. Its reasoning, though, rests on the GDPR, which applies in the same way across the EU and EEA, and on the view that an IP address can be personal data, which the Court of Justice of the EU confirmed for dynamic IP addresses in the Breyer case (C-582/14) in 2016. If your website is aimed at people in the EU, the same question applies to you wherever your company is based. The UK GDPR follows the same principles.

Nobody needs to panic. But self-hosting removes the question entirely, costs nothing and takes an afternoon at most. That is why we treat it as the default.

03 / Guides

What hosting Google Fonts locally means technically

When fonts are loaded dynamically, your page's code contains a reference to fonts.googleapis.com. The browser fetches a stylesheet from there and then the actual font files from fonts.gstatic.com. Both requests reveal the visitor's IP address to Google.

When you self-host, you download the font files once, put them on your web server and describe them in your own stylesheet. The browser then only talks to your server. Most Google Fonts are published under open licences such as the SIL Open Font License, which explicitly allows self-hosting.

04 / Guides

How to check whether your website loads Google Fonts

1. 01

   Open a private window

   Open your website in Chrome or Firefox in a private window so that cached files do not hide anything.

2. 02

   Open the developer tools

   Press F12 (on a Mac, Cmd + Option + I) and switch to the Network tab. Tick “Disable cache”.

3. 03

   Reload and filter

   Reload the page and type fonts.g into the filter box. If you see requests to fonts.googleapis.com or fonts.gstatic.com, your page still loads fonts from Google.

4. 04

   Check other pages

   Repeat on the contact page, blog posts and pages with maps, videos or forms. Often it is not the theme that loads the fonts but a single plugin, widget or embedded Google Map.

5. 05

   Double-check the source

   Also view the page source (Ctrl + U, on a Mac Cmd + Option + U) and search for fonts.googleapis. If neither the source nor the Network tab shows anything, the page is clean on this point.

05 / Guides

How to self-host Google Fonts on any website

This works on every website, hand-coded or built with a CMS:

1. 01

   List fonts and weights

   Write down which fonts are used in which weights, for example Inter 400 and 700. Every weight you do not need costs loading time.

2. 02

   Download the files

   The free google-webfonts-helper (gwfh.mranftl.com) lets you pick font, character set and weights, and gives you the files in the modern WOFF2 format together with ready-made CSS.

3. 03

   Upload

   Put the files in a folder on your server, for example /fonts/, or in your theme's assets folder.

4. 04

   Add @font-face rules

   Your stylesheet needs one block per weight, following this pattern: @font-face { font-family: "Inter"; src: url("/fonts/inter-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

5. 05

   Remove the old reference

   Delete the link tag pointing to fonts.googleapis.com from the page head and any @import of Google Fonts in your CSS files. In WordPress, a child theme can stop the theme's font stylesheet with wp_dequeue_style.

6. 06

   Check again

   Test the page in the Network tab once more. No requests to fonts.googleapis.com or fonts.gstatic.com should appear.

06 / Guides

Hosting Google Fonts locally in WordPress

Start with the theme settings. Many popular themes, including Astra and Kadence, have an option in the Customizer to load Google Fonts locally. With it switched on, the theme downloads the fonts once and serves them from your server afterwards.

If plugins such as sliders, forms or page builders load fonts as well, a dedicated plugin helps. OMGF (Optimize My Google Fonts) finds the Google Fonts requests on your pages, downloads the files and rewrites the references. Local Google Fonts is an alternative. Either way, check every important page in the Network tab afterwards, because no plugin catches every embed, and clear any caching plugin, or you will still see the old version.

07 / Guides

Elementor and Divi

Elementor loads every font you pick in the editor from Google by default. Recent versions have an option in the Elementor settings to load Google Fonts locally. Switch it on, regenerate the CSS files and check the Network tab. If your version lacks the option, you can disable Google Fonts in Elementor entirely and upload the font files under Custom Fonts in Elementor Pro, or let OMGF handle it. Remember the global fonts in Elementor's site settings, which decide what is used everywhere.

In Divi, the switch is under Divi › Theme Options › General. Turn off Google Fonts and Divi stops loading them. You then upload your font as a file through the font menu in a module's design settings, after which it is available in every module. Clear the Divi cache and any page cache, then check the important pages.

08 / Guides

Shopify: are fonts loaded from Google?

Fonts picked from the font library in the Shopify theme editor are served from Shopify's own servers, not from Google. Google Fonts still turn up in Shopify stores when a theme, an app or an earlier customisation embeds them directly.

Check your store in the Network tab. If you find Google requests, go to Online Store › Themes, open Edit code on your theme, open theme.liquid and search for fonts.googleapis. Upload the WOFF2 files to the theme's assets folder or under Content › Files and add them with @font-face in the theme's stylesheet. If an app such as a reviews widget is the source, look for a setting in the app or ask the app developer. For custom storefronts where we control every file that loads, we build with Shopify Hydrogen.

09 / Guides

What else on your site talks to Google

Once the fonts are fixed, the Network tab often shows other Google requests. They were not part of the Munich case, but they raise similar questions:

10 / Guides

Your privacy policy, and what to do with a demand letter

Once your website no longer loads anything from Google Fonts, you can remove or update the Google Fonts section of your privacy policy. Check again after every major theme, plugin or app update, because updates can reset settings or bring in new embeds.

If you have received a letter demanding payment over Google Fonts, switch the website over straight away, record the date with screenshots of the Network tab, and have the letter checked by a lawyer before you pay anything or sign a cease-and-desist declaration. What is owed, if anything, depends on the individual case. This guide is not a substitute for legal advice.

11 / Guides

A side effect: self-hosted fonts load faster

Without extra connections to two Google domains, text renders sooner, and with only the weights you need in WOFF2 the download shrinks. If your site is slow in general, our guide to a slow WordPress site covers the other usual suspects. In our own web design and development projects, every site is hand-coded and fonts are self-hosted from the first day.