@font-face generator

Font style
Font URL

Leave the URL input empty if you do not have a specific font type.

Generated code
@font-face {
    font-family: "";
    font-style: normal;
    font-display: swap;
:root {
Copy and Paste the generated code inside your
Themes -> ‘Customize’ -> ‘Theme settings’ -> ‘CUSTOM CODE -> ‘Css code’ area.

You can use the @font-face generator multiple times to apply fonts for display text, header text, body text separately, paste all the generated code into the "Css Code" area, and make sure to enter different font names.