Google Fonts is a free directory of typefaces run by Google at fonts.google.com. Every font in it is released under an open-source licence, most often the SIL Open Font License, so you can use it on websites, in print and in apps, including commercial ones, without paying. Popular families include Roboto, Open Sans, Inter, Lato, Montserrat and Merriweather.
How a site loads a Google Font
The quick method is to pick a family and weights on the site, then paste the <link> tag it gives you into your page's head. That tag loads a small stylesheet from fonts.googleapis.com, which in turn points the browser at font files on fonts.gstatic.com. You then name the font in your CSS font-family rule. The URL includes display=swap by default, which tells the browser to show text in a fallback font immediately and switch once the real one arrives.
The alternative is self-hosting: download the font files (usually WOFF2) and serve them from your own domain with an @font-face rule. Build tools such as Fontsource package Google Fonts for exactly this.
The privacy question in Europe
When a browser fetches a font from Google's servers, it sends the visitor's IP address to Google. In January 2022 a regional court in Munich ruled that a website doing this without consent breached the GDPR and awarded the visitor damages. The ruling triggered waves of warning letters to German site owners. Self-hosting removes the issue entirely because no request goes to Google. If you serve customers in the EU, self-hosting is the safer default.
Example: a salon picks two fonts
A hair salon wants an elegant heading font and a clean body font. The owner chooses Playfair Display for headings and Lato for text, selecting only the two weights actually used. Her developer downloads both and self-hosts them, so the site makes no third-party font requests and the files are cached with the rest of the site.
Google Fonts mistakes
- Loading every weight and style. Each one is a separate download that delays text and can hurt Largest Contentful Paint.
- Using four or five families. One or two is normal; more looks messy and loads slowly.
- Removing the display setting. Without it, some browsers hide text until the font downloads.
- Assuming "free" means no obligations. The licence lets you use the fonts freely, but check its terms before selling the font files themselves.
Related terms
- Typography: how to use the fonts you pick.
- Sans serif: the style most Google Fonts downloads belong to.
- Serif: classic faces also in the library.
- GDPR: the law behind the self-hosting advice.