Using custom fonts | Pinegrow Docs

There are two approaches:

Using the Design panel

There are no differences when it comes to fonts hosted on Google Fonts, Adobe and other services.

To self-host web fonts, go to Manage fonts in the Design panel:

Pinegrow Design panel with the Typography section and a Manage fonts button highlighted by an orange arrow.

There, at the bottom of the list, click on the Add font button and select Self hosted web font:

Font menu with Self-hosted web font highlighted, with a Google font list behind it showing Ubuntu, Work Sans and Zilla Slab.

Enter the font family name, fallback font families and fill in as many Font variants sections as needed:

Add or edit a self-hosted web font dialog with font family name My Font and WOFF2, WOFF and TTF file URL fields.

Using a font management plugin

Alternatively, you can use any of the 3rd party font management plugins for WordPress to manage custom fonts.

We recommend using Yabe Webfont because it integrates with Pinegrow’s visual CSS editor. Custom fonts managed by this plugin can be selected directly in Font family dropdown in Pinegrow. Pinegrow integration is included in the free version of the plugin.

A hint: If you want to show fonts managed by 3rd party plugins in the Design panel, just enter their family names in Manage fonts › Add font › System font and then include them in the current design. These fonts will also be shown in the visual CSS editor.