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.

Themeover

Ahrale

Jose Luis Cruz

A light-weight yet powerful visual editor to customize the CSS styling of any aspect of your site, from Google fonts to responsive layouts. Microthemer caters for both coders and non-coders, and plays really well with page builders like Elementor, Beaver Builder, and Oxygen.
<h4>Feature list</h4>
<ol>
<li>Style anything</li>
<li>Use with any theme or plugin</li>
<li>Point & click visual styling</li>
<li>Code editor (CSS, Sass, JS)</li>
<li>Sync code editor with the UI</li>
<li>Customisable breakpoints</li>
<li>HTML and CSS inspection</li>
<li>150+ CSS properties</li>
<li>Dark or light theme</li>
<li>Custom toolbar layouts</li>
<li>Work with any CSS unit</li>
<li>Color picker with palettes</li>
<li>Slider, mousewheel, keyboard adjustments</li>
<li>In-program CSS reference</li>
<li>History</li>
<li>Draft mode</li>
<li>Global or page-specific styling</li>
<li>Import & export</li>
<li>Light-weight</li>
<li>Minify CSS code</li>
<li>Keyboard shortcuts</li>
<li>Deep integration with Elementor, Beaver Builder, Oxygen</li>
<li>Multisite support</li>
<li>Uninstall MT, but keep your edits</li>
<li>[Pro] CSS grid (drag & drop)</li>
<li>[Pro] Flexbox</li>
<li>[Pro] Stock SVG mask images</li>
<li>[Pro] Transform</li>
<li>[Pro] Animation</li>
<li>[Pro] Transition</li>
</ol>
<h4>Lite VS Pro</h4>
This lite version limits you styling 15 things, and doesn’t include the features marked [Pro] in the list above. To unlock the full program, you can <a href="https://themeover.com/" rel="nofollow ugc">purchase a license</a> (monthly, annual, or lifetime).
<h4>Useful links</h4>
<ul>
<li><a href="https://themeover.com/" rel="nofollow ugc">Website</a></li>
<li><a href="https://themeover.com/introducing-microthemer-7/" rel="nofollow ugc">Video docs</a></li>
<li><a href="https://livedemo.themeover.com/setting-up-demo-site/?create_demo" rel="nofollow ugc">Live demo</a></li>
<li><a href="https://themeover.com/forum/" rel="nofollow ugc">Support forum</a></li>
<li><a href="https://www.facebook.com/groups/microthemer" rel="nofollow ugc">Facebook group</a></li>
</ul>
<h4>Author note</h4>
Hello everyone, my name is Sebastian. I’ve designed Microthemer for developers as well as beginners. My aim is to level up beginners by exposing the CSS code Microthemer generates when using the visual controls. This is of course helpful for developers who may wish to make manual edits. Some developers use Microthemer as an in-browser CSS or Sass editor, and just lean on the interface for element selection or more advanced properties like filters, grid, and animation.
I’ve been happily developing Microthemer and supporting users of varying technical experience in my forum for many years now. I’m always ready to answer questions about the software and help out with CSS hurdles. Please don’t hesitate to get in touch!

Microthemer Lite – Visual Editor to Customize CSS

A visual editor to customize the CSS styling of anything on your site - from Google fonts to responsive layouts.

Self-Hosted Google Fonts vs Microthemer Lite – Visual Editor to Customize CSS