CSS Preview

Followed by the explanation on how to disable plugin and reuse resources once you are ready for website delivery we made a feature to easily copy CSS code.

Read More

Disable plugin in production

Hey there! In this post, I’m going to show you how to disable Font Hero and use CSS and other fonts instead. This is perfect if you’re finished designing your website and don’t want to deal with plugin updates anymore. So, let’s say you’ve already designed your typography and you’re ready to move your website […]

Read More

Inline Font Declarations CSS

When it comes to web development, there are various ways to add custom fonts to your website. One of the most popular methods is to use CSS @font-face rule to specify a font file and then apply it to your HTML elements. However, the question arises as to whether to include the CSS code inline […]

Read More

Winden

Integrating Custom Fonts with Tailwind CSS using Font Hero In this tutorial, we will be exploring how to integrate custom fonts with Tailwind CSS using Font Hero. Font Hero is a web-based tool that allows you to create and customize font pairings for your website. First, we need to open the Tailwind documentation and navigate […]

Read More

Beaver Builder

In this blog post, we will be discussing the integration of Beaver Builder with Font Hero, a tool that allows users to access a wide variety of fonts for their website. We will also demonstrate how to use Font Hero within Beaver Builder to change the font family of your website. Firstly, let’s take a […]

Read More

Bricks Builder

Enhancing Performance with BRICKS Integration and Font Hero Introduction: Font Hero offers users the option to self-host their fonts, providing greater control over font files and improved performance. By inspecting individual font faces, users can access several valuable features, such as the font display and swap options. The font swap option is particularly useful as […]

Read More

Oxygen Builder

Using Custom Fonts with Oxygen Builder In this tutorial, we will guide you through the process of using custom fonts with Oxygen Builder. We will be installing one of Oxygen Builder’s design sets, disabling Google fonts, registering a custom font, and applying it globally within Oxygen. Step 1: Install a Design Set Begin by installing […]

Read More

Gutenberg

Integrating Custom Fonts in Gutenberg Integrating custom fonts into your Gutenberg editor is a straightforward process. This guide will show you how to add and use new font families in the Gutenberg editor, even if you’re not using the latest WordPress version. We will also cover the steps to install and activate the necessary Gutenberg […]

Read More

How to Target Selectors

Introduction: In some cases, you might find yourself working with a contact form that does not offer configuration options for certain elements. In this blog post, we’ll walk you through a simple process to customize a form’s label to match the font family of a sub-headline using CSS. This technique can be applied to target […]

Read More

Font Pairing Collection

Enhance Your Design with Custom Font Pairings Introduction: Are you looking for a way to make your website stand out with unique font pairings? We have a solution for you! We offer the option to self-host custom fonts and provide 16 beautiful, professionally crafted font pairings. Each font pairing comes with three font families to […]

Read More