RotiStudio

Tamas Rottenbacher

Hungarian: <a href="https://rotistudio.hu/bovitmenyek/web-safe-betutipusok-wordpress-szerkesztohoz/" rel="nofollow ugc">Magyar nyelvű bővítmény leírás</a>
This plugin adds 15 web safe font families to the WordPress block editor’s typography panel. No Google Fonts, no external requests, no JavaScript font loaders, CSS import — just the fonts that are already installed on your visitors’ devices.
Web safe fonts are pre-installed on Windows, Linux operating systems, which means they render instantly without any network request. Your website loads faster, looks consistent across devices, and avoids layout shifts caused by font loading.
We have a Plan B! When a visitor uses a different operating system or device, the plugin loads the same or an alternative font, so the design won’t change.
Available fonts:
Sans-serif 
– Arial (Alternative: Liberation Sans) 
– Verdana (Alternative: DejaVu Sans) 
– Tahoma (Alternative: DejaVu Sans) 
– Trebuchet MS (Alternative: CabinCondensed) 
– Arial Black (Alternative: Archivo Black) 
– Lucida Sans Unicode (Alternative: DejaVu Sans) 
– MS Sans Serif (Alternative: DejaVu Sans) 
– Impact (Alternative: Oswald)
Serif 
– Times New Roman (Alternative: Liberation Serif) 
– Georgia (Alternative: Liberation Serif) 
– Palatino Linotype (Alternative: TeX Gyre Pagella) 
– Book Antiqua (Alternative: TeX Gyre Pagella)
Monospace 
– Courier New (Alternative: Liberation Mono) 
– Lucida Console (Alternative: DejaVu Sans Mono)
Cursive 
– Comic Sans MS (Alternative: Comic Neue)
Why is this plugin beneficial? 
– No external font files or network requests 
– Fonts load instantly — already available on the user’s device 
– Uses standard, pre-installed system fonts (no Android, iOS, or macOS dependencies) 
– Works with every block that supports typography (paragraph, heading, button, etc.) 
– No additional privacy, GDPR, or cookie measures required 
– Fully compatible with Full Site Editing (FSE) and block themes 
– Core Web Vitals friendly — eliminates font-related render blocking and layout shifts 
– Lightweight, with no overengineered or unnecessary features 
– Downloads a font only when necessary
How it works 
The plugin registers the font families in the theme.json data layer via the <code>wp_theme_json_data_theme</code> filter. This makes them appear alongside your theme’s own fonts in the Typography panel of every block that supports font selection. The corresponding CSS classes are enqueued as inline styles, so fonts are applied correctly both in the editor and on the frontend.
Do you have other plugins? Yes, check my plugins website: <a href="https://rotistudio.com/" rel="nofollow ugc">rotistudio.com</a> 
Where can we learn more about your work? Check my personal website there: <a href="https://rottenbacher.hu/" rel="nofollow ugc">rottenbacher.hu</a>

Web-Safe Fonts for Editor by RotiStudio

Add the option to choose web safe fonts in the WordPress block editor (Gutenberg), so your website can be faster and more consistent appearance.

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.

Web-Safe Fonts for Editor by RotiStudio vs The Typography