Typography

How to Use Google Fonts in Aurora

By Daniel Ekay May 18, 2026 2 min read
Docs Typography How to Use Google Fonts in Aurora
Share:
Last updated:

All font families in Aurora are sourced from Google Fonts. You select them directly in the Customizer by typing the font name. No separate plugin or manual embed code is needed. Google Fonts is one of the font sources available in Aurora’s typography system.

Aurora Typography panel showing four font categories: Headings, Body Font, Menu Font, Button Font

How to Apply a Google Font

  1. Go to Appearance → Customize → Typography.
  2. Open the font category you want to change: Body, Headings, Menu, or Buttons.
  3. Find the Font Family field.
  4. Type the exact name of the Google Font you want, for example Inter or Playfair Display.
  5. The preview updates live to show the new font.
  6. Click Publish.

Finding Font Names

To find available font names, browse fonts.google.com. The name shown at the top of each font card is the exact name to type into Aurora’s font family field. Font names are case-sensitive. Type them exactly as they appear on Google Fonts.

Examples of correctly formatted font names:

  • Roboto
  • Open Sans
  • Playfair Display
  • Merriweather
  • DM Sans
  • Source Serif 4

How Aurora Loads Google Fonts

Aurora adds a preconnect link to fonts.googleapis.com and fonts.gstatic.com in the page head. This pre-establishes the connection to Google’s font servers before the browser requests the font files, reducing the time it takes for fonts to load.

Aurora Body Font settings showing Font Family, Size, Line Height, Letter Spacing, Font Weight and other controls

The actual font stylesheet is loaded only for the fonts you have selected. If you are using the same font for body and headings, Aurora requests a single font family, not multiple.


Font Weights and Styles

Aurora requests the font weights you have configured in the typography settings. If you set your heading font weight to 700, Aurora includes the 700 weight in the Google Fonts request. Using multiple weights from the same family increases load time slightly. Using two or three weights from one family is preferable to loading many different families.

Aurora Headings typography settings showing Select Heading dropdown with H1 through H6 options and font controls

Using a System Font Instead

If you prefer not to load any external fonts, you can use system fonts by entering a font stack directly into the family field, for example: -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif. System fonts load instantly since they are already on the user’s device.

If you need to use a purchased or brand font that is not on Google Fonts, see custom fonts without Google.

Make your blog stand out

Enjoy the ease and flexibility of Aurora. Create stunning blog designs your readers will love, with live preview editing and effortless template mixing and matching enabled.

Get Aurora today for just $39

Get Aurora