Alvaro

<a href="https://gutenberg-showcase.melonpan.io/the-typography" rel="nofollow ugc">Demo</a> – <a href="https://melonpan.io/wordpress-plugins/the-typography" rel="nofollow ugc">Documentation</a> – <a href="https://github.com/garciaalvaro/the-typography" rel="nofollow ugc">GitHub</a>
Add Typography to your Gutenberg site using Google Fonts. Enter CSS selectors or select Blocks to apply custom typography.
<h3>Typography style</h3>
Available typography options include:
<ul>
<li>Font family & variants from Google Fonts</li>
<li>Color (hex or rgba)</li>
<li>Font size</li>
<li>Line height</li>
<li>Font weight</li>
<li>Font style (italic, normal, oblique)</li>
<li>Letter spacing</li>
<li>Text transform (capitalize, uppercase, lowercase)</li>
<li>Text decoration (line-through, overline, underline)</li>
</ul>
<h3>Typography context</h3>
Typographies can be assigned to a specific context:
<ul>
<li>All site</li>
<li>Post types/s (post types available on the site)</li>
<li>Post types/s template (index, single)</li>
<li>Front page</li>
<li>404 page</li>
</ul>
<h3>Typography selectors</h3>
Each typography can have several groups of selectors with unique modifications based on the root typography. 
For example: a typography can be set with a certain Font, Color and Font size; 
each of its groups of selectors inherit those properties and one could modify the inherited color and other the inherited Font size.
Available CSS selectors include:
<ul>
<li>Text CSS selector (eg: .site-title a)</li>
<li>Block Selector (eg: Block Quote > Citation)</li>
</ul>
<h3>Usage</h3>
The plugin can be accesed from the Customizer inside the tab The Typography. 
It can also be accesed from any Block editor’s The Typography sidebar (top right corner of the editor). 
Create a typography and assign it some options; create a group of selectors and inside it create some CSS or Block selectors. 
That’s it! 
If you want to preview the different fonts before selecting one you can preview them in the <a href="https://fonts.google.com/" rel="nofollow ugc">Google Fonts repository</a>. 
Note: The typography editing is assigned to the ‘edit_theme_options’ capability. This means that, by default, only admin and super admin will be able to use the features.

The Typography

Add Typography to your Gutenberg site using Google Fonts.

asadkn

An easy way to self-host all your Google Fonts for increased Privacy or to meet a law requirement. 
Theme and plugin authors are often unwilling to offer a self-hosted method and it’s quite laborious to download and upload each of the required font.
This plugin makes it all easy. It will scan all CSS on your site and automagically download and host on your server the necessary Google Web Fonts.
How it works:
<ul>
<li>Converts all Google Font enqueues to locally hosted CSS files.</li>
<li>Scans and converts any inline style tags using @imports for fonts.</li>
<li>Processes all the local CSS files that weren’t properly enqueued (bad authors?).</li>
<li>While doing so, downloads all the required Google Fonts to your server.</li>
</ul>
Features:
<ul>
<li>Automatic self-hosted fonts with no effort.</li>
<li>Compatible with all themes and plugins.</li>
<li>Supports IE9+ and all modern browsers.</li>
<li>Optimized code benchmarked for performance.</li>
<li>Built-in cache for processing.</li>
<li>Compatible with cache plugins and Autoptimize.</li>
<li>API and hooks for theme & plugin authors.</li>
<li>Uses unicode-range for optimized fonts when using multiple subsets. Google officially does this too, but other solutions for downloading fonts don’t support this.</li>
</ul>
Dev Notes
Cache: The most common reason for a failure. If you have a cache plugin, clear the caches.
It will not work with JS solutions like WebFont Loader. If you’re a developer, you can still use this plugin’s API to get the needed CSS and files to convert your WebFont Loader. I will post instructions on support forums if there’s interest.

Self-Hosted Google Fonts

Automatically self-host all the Google Fonts on your site. Plug and play.

The Typography vs Self-Hosted Google Fonts